@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
* {
  margin: 0;
  padding: 0;
  text-decoration: none;
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  outline: none;
}

a{
  cursor: pointer;
}
html, body{
  margin: 0;
  padding: 0;
  min-height: inherit !important;
  overflow:hidden
}
:root {
  
 
    --logo-mini: url(../img/logo-mini.png);
    --logo-mini-height: 33px;
    --logo-mini-width: 51px;
    --logo: url(../img/logo.png);
    --logo-height: 30px;
    --logo-width: 180px;
  --header-height: 3rem;
  --nav-width: 244px;
  --body-font:
    'Nunito', sans-serif;
  --normal-font-size: 1rem;
  --z-fixed: 100;
  --new-primary-color:#4D48B4;
  --new-primary-nav-bar-color:#26245A;

}



/***************   Old style dependency ****************/




select {
  font-size: 14px;
  background: transparent;
}

img {
  width: 100%;
}

body {
  background: #ffffff;
}
.p-datatable .p-datatable-tbody>tr>td a{color: var( --new-primary-color);}
.mt-15 {
  margin-top: -15px
}

.clear {
  clear: both;
  display: block;
  content: ".";
}

.arrow-dis {
  display: none;
}

*,
::before,
::after {
  box-sizing: border-box
}

.dashboard-body {
  position: relative;
  margin: var(--header-height) 0 0 0;
  padding: 0 1rem;
  font-family: var(--body-font);
  font-size: var(--normal-font-size);
  transition: .5s;
  padding-right: 0;
}

a {
  text-decoration: none
}

tr {
  vertical-align: middle;
  /* box-shadow: 1px 1px 3px #00000036; */
  transition: box-shadow 0.2s;
  background: #fff;
}

.tbl-cat {

  background: #e8e6ff;

  padding: 4px 6px;

  border-radius: 3px;

  color: #42505C;

  white-space: nowrap;

  font-size: 12px;
}



button.exp-btn {
  color: #ffffff;
  padding: 0rem 1.5rem;
  background: var( --new-primary-color);
  box-shadow: 1px 1px 10px #9fcbffb8;
  width: auto;
  float: right;
  border-radius: 6px;
  font-size: 13px;
  height: 100%;
  font-weight: 500;
}

button.btn {}

button.exp-btn:hover,
button.exp-btn:focus {
  background: var(--cus-btn-color-hover);
  color: #fff;
}

.keyword-exp-btn {

  display: flex;

  justify-content: space-between;

  margin-bottom: 20px;

  align-items: end !important;
}


.height-100 {
  height: 100vh
}

.bx-chevron-right:before {
  content: "\ea50" !important;
}

.offcanvas.offcanvas-end {
  width: 570px !important;
  background: #ffffff;
  height: 100%;
  overflow: auto;
  box-sizing: border-box;
}



.drawer img {
  width: 100%;
}

.drawer a {
  font-size: 14px;
  font-weight: 400;
  line-height: 25px;
  color: #9f9f9f;
}

.price-details {
  text-align: center;
  padding: 15px 5px;
}

.price-compare {
  padding: 15px 10px;
  background: #fff;
}

.price-compare p {
  color: #000 !important;
  font-size: 12px !important;
}

.drawer h2 {
  color: #fff;
  font-size: 28px;
  font-weight: 700;
  margin: 7px 0;
}

.drawer p {
  font-size: 15px;
  color: #FFF;
  font-weight: 500;
}

.bg-blue {
  background: var( --new-primary-color) !important;
}

.bg-orange {
  background: #efaf09 !important;
}

.bg-green {
  background: #36c956 !important;
}



.clr-green {
  color: #36c956 !important;
}

.clr-blue {
  color: var( --new-primary-color) !important;
}

.clr-red {
  color: #ff0000 !important;
}

.clr-orange {
  color: #FFA500 !important;
}

td span.clr-green,
td span.clr-blue,
td span.clr-red,
td span.clr-orange {
  font-weight: 500;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.chart-box {
  text-align: center;
  background: #fff;
}

.chart-heading {
  display: flex;
  justify-content: space-between;
  padding: 15px;
  align-items: center;
}

.chart-heading h1 {
  font-size: 16px;
  color: #42505C;
  font-weight: 600;
  margin: 0;
  line-height: 36px;
}

.chart-heading button,
.load-more-btn button {
  width: auto;
  font-size: 11px;
  background: #2666fa;
  border: 0;
  color: #fff;
  padding: 0px 15px;
  line-height: 0;
  /* height: 25px; */
}
.ans{
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.ans h1{
    font-size: 13px;
}
.ans p{
    font-size: 13px;
    margin: 0;
    font-weight: 400;
}
.ans ul{list-style-type: disc;padding-left: 30px;display: flex;flex-direction: column;gap: 15px;}
.ans ul li{
    font-size: 13px;
    margin: 0;
    font-weight: 400;
    list-style-type: disc;
}
.load-more-btn button {
  padding: 15px 10px;
}

.download-all-btn {
  padding: 0 15px;
  text-decoration: underline;
  text-align: right;
  display: block;
}

.chart-heading h3 {
  font-size: 15px !important;
  margin: 0;
  line-height: 25px;
  font-weight: 300;
}

.chart-heading h3 span {
  font-weight: 800;
}

.chart-select {
  justify-content: end;
  padding: 10px;
  gap: 10px;
}

.chart-select select {
  width: 140px;
  margin-left: 10px;
}

@keyframes chartjs-render-animation {
  from {
    opacity: 0.99;
  }

  to {
    opacity: 1;
  }
}

.chartjs-render-monitor {
  animation: chartjs-render-animation 1ms;
}

.chartjs-size-monitor,
.chartjs-size-monitor-expand,
.chartjs-size-monitor-shrink {
  position: absolute;
  direction: ltr;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  pointer-events: none;
  visibility: hidden;
  z-index: -1;
}

.chartjs-size-monitor-expand>div {
  position: absolute;
  width: 1000000px;
  height: 1000000px;
  left: 0;
  top: 0;
}

.chartjs-size-monitor-shrink>div {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

.table-title-btn {
  background: none;
  padding: 0;
  border: 0;
  text-align: left;
  color: #2666fa;
  display: flex;
  width: 350px;
}

.price-table {}

.price-table table {
  /* width: 2150px; */
  min-width: 100%;
  /* border-collapse: separate; */
  /* border-spacing: 0 .5rem; */
  background: #f4f4f4 !important;
  padding: 0 10px !important;
  border-radius: 6px;
  /* height: 100%; */
}

.map table {
  width: 900px !important;
  min-width: 100%;
}

.price-table i {
  /* -webkit-text-stroke: 0.5px; */
}

thead tr {
  box-shadow: none;
}

.table>thead th {

  vertical-align: middle;

  font-size: 13px !important;

  background: transparent;

  color: #495057;

  font-weight: 600;

  text-transform: uppercase;
}

.accordion-table,
.accordion-table tr {
  background: #f4f8ff !important;
}

.accordion-table {
  box-shadow: inset 2px 1px 3px #0000002e !important;
}


.product-small-img {
  max-width: 30px;
  /* float: left; */
  width: auto;
  max-height: 30px;

}

td:has(> .product-small-img) {
  text-align: center !important;
}


.main-content h3 {
  color: #42505C;
  font-size: 21px;
  margin: 0;
  padding: 0;
}

.filter-box {}

.filter-box label {
  font-size: 15px;
  margin-bottom: 3px;
  color: #42505C;
}

.accordion-header {
  margin: -1px 0 !important;
}

.accordion-button {
  border: 0;
  padding: 8px;
  margin: 0;
}


.range-slider {
  width: 100%;
  margin: auto;
  text-align: center;
  position: relative;
  background: #fff;
  height: 18px;
  padding: 40px;
}

.range-slider span input {
  position: absolute;
  top: 10px;
  border: 0;
  background: none;
}

.range-slider span input.low {
  left: 0
}

.range-slider span input.high {
  right: 0
}

.range-slider svg,
.range-slider input[type=range] {
  position: absolute;
  left: 10px;
  bottom: 20px;
  right: 10px;
}

input[type=number] {
  border: 1px solid #ddd;
  text-align: center;
  font-size: 15px;
  -moz-appearance: textfield;
  position: relative;
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

input[type=number]:invalid,
input[type=number]:out-of-range {
  border: 2px solid #ff6347;
}

input[type=range] {
  -webkit-appearance: none;
  width: clac(100% - 20px);
}

input[type=range]:focus {
  outline: none;
}

input[type=range]:focus::-webkit-slider-runnable-track {
  background: #2497e3;
}

input[type=range]:focus::-ms-fill-lower {
  background: #2497e3;
}

input[type=range]:focus::-ms-fill-upper {
  background: #2497e3;
}

input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  animate: 0.2s;
  background: #2497e3;
  border-radius: 1px;
  box-shadow: none;
  border: 0;
}

input[type=range]::-webkit-slider-thumb {
  z-index: 2;
  position: relative;
  box-shadow: 0px 0px 0px #000;
  border: 1px solid #2497e3;
  height: 18px;
  width: 18px;
  border-radius: 25px;
  background: #a1d0ff;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -7px;
}

input[type=range]::-moz-range-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  animate: 0.2s;
  background: #2497e3;
  border-radius: 1px;
  box-shadow: none;
  border: 0;
}

input[type=range]::-moz-range-thumb {
  z-index: 2;
  position: relative;
  box-shadow: 0px 0px 0px #000;
  border: 1px solid #2497e3;
  height: 18px;
  width: 18px;
  border-radius: 25px;
  background: #a1d0ff;
  cursor: pointer;
}

input[type=range]::-ms-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  color: transparent;
}

input[type=range]::-ms-fill-lower,
input[type=range]::-ms-fill-upper {
  background: #2497e3;
  border-radius: 1px;
  box-shadow: none;
  border: 0;
}

input[type=range]::-ms-thumb {
  z-index: 2;
  position: relative;
  box-shadow: 0px 0px 0px #000;
  border: 1px solid #2497e3;
  height: 18px;
  width: 18px;
  border-radius: 25px;
  background: #a1d0ff;
  cursor: pointer;
}

.accordion-body {
  padding: 0 !important;
  /* background: #f7f7f7; */
  border: 0;
}

.audit-acc .accordion-body {
  padding: 0;
}

.tableFixHead {
  overflow-y: auto;
  height: auto;
  max-height: 550px;
}

.tableFixHead thead {
  position: sticky;
  top: -1px;
  /* z-index: 9999; */
}

table {
  border-collapse: collapse;
  width: 100%;
}


thead th,
td {
  font-size: 13px !important;
  /* text-align: center; */
}


tbody tr th {
  background: #f9f9ff;
  text-align: center;
}

.table-responsive::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

.table-responsive::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.table-responsive::-webkit-scrollbar-thumb {
  background: #888;
}

.table-responsive::-webkit-scrollbar-thumb:hover {
  background: #555;
}



.offcanvas-body::-webkit-scrollbar {
  width: 5px;
  height: 0px;
}

.offcanvas-body::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.offcanvas-body::-webkit-scrollbar-thumb {
  background: #888;
}

.offcanvas-body::-webkit-scrollbar-thumb:hover {
  background: #555;
}


.tableFixHead table tbody tr.table-row-active {
  background: #dee8ff;
}

.accordion-item {
  margin: 5px 0;

}

.accordion-button {
  background: #f3f2ff !important;
  font-size: 14px !important;
  padding: 10px 10px !important;
}

.cus-bg-light {
  background: #f8fbff;
  z-index: 9;
}

.breadcrumb {
  align-items: center;
  margin: 0;
}

.main-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* display: none; */
  padding: 10px 0;
  border-bottom: 1px solid #cacaca;
  display: none;
}

.offcanvas-title {
  font-weight: 300;
  font-style: italic;
  color: #c2c2c2;
  font-size: 15px;
}

.offcanvas-title-cus {

  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
}

.main-head {
  font-size: 20px;
  font-weight: 600;
  color: var( --new-primary-color);
  font-style: normal;
}

.main-heading button {
  border: 1px solid #ccc;
  padding: 5px 15px;
  background: var( --new-primary-color);
  color: #fff;
}

.breadcrumb-item {
  font-size: 14px;
}

.breadcrumb-item.active {
  padding: 5px 10px;

  background: #f8fbff;
  color: var( --new-primary-color);
  margin-left: 10px;
}
.dashboard-box {
  color: #42505C;
  height: 100%;
  border-radius: 8px;
  box-shadow: 0px 0px 7px #0000003b;
  padding: 15px 10px;
}

.dashboard-head-strap {
  background: #ffffff;
  border-radius: 6px;
  padding: 10px 5px;
  display: flex;
  justify-content: space-around;
  box-shadow: 0px 0px 7px #0000003b;
}

.dashboard-head-strap span {
  font-size: 18px;
  color: var( --new-primary-color);
  font-weight: 500;
}

.dashboard-head-strap span sub {
  font-size: 13px;
  position: relative;
  bottom: 0px;
}

.dashboard-box h1 {
  font-size: 14px;
  margin-bottom: 15px;
}

.dashboard-box p {
  font-size: 14px;
  line-height: 30px;
}

.dashboard-box h6 {
  font-size: 20px;
  font-weight: 600;
  color: var( --new-primary-color);
}

.dashboard-box h5 {
  font-weight: 500;
  font-style: italic;
  color: #c2c2c2;
  font-size: 14px;
  text-transform: uppercase;
}

.dashboard-data {
  display: flex;
  flex-wrap: wrap;
  gap: 2%;
  /* justify-content: space-around; */
}

.dashboard-data div {
  flex: 1 0 49%;
}

.category-box .dashboard-data div {

  flex: unset;
}

.dashboard-data h2 {
  display: inline-block;
  font-size: 26px;
}

.dashboard-data h2 span {
  font-size: 16px;
}

.dashboard-data p {
  display: inline-block;
  font-size: 12px;
}

.bgclr1 {
  background: #d8eaff;
  color: var( --new-primary-color);
}

.bgclr2 {
  background: #fdf7f0;
  color: #DE6E07;
}

.bgclr3 {
  background: #faf5f9;
  color: #790b68;
}

.bgclr4 {
  background: #fafcfb;
  color: #107526;
}

.bgclr5 {
  background: #107526;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bgclr5 h2 {
  display: flex;
  align-items: center;
  gap: 15px;
  margin: 0;
}

.bgclr5 span:first-child {

  font-size: 26px;
}

.bgclr6 {
  background: #790b68 !important
}

.bgclr1:hover {
  background: var( --new-primary-color);
  color: #fff;
}

.bgclr2:hover {
  background: #DE6E07;
  color: #fff;
}

.bgclr3:hover {
  background: #790b68;
  color: #fff;
}

.bgclr4:hover {
  background: #107526;
  color: #fff;
}

.dashboard-box-head {
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.dashboard-box-head h1 {
  margin: 0;
}

.dashboard-box span a {
  color: #0006;
  font-size: 20px;
}

.box-1 {
  border-top: 9px solid #DE6E07;
}

.box-1 ul li label span {
  background: #DE6E07;
}

.box-1 ul li.brand {
  background: #ffe9af;
  color: #DE6E07;
}

.box-2 {
  border-top: 9px solid #790b68;
}

.box-2 ul li label span {
  background: #790b68;
}

.box-2 ul li.brand {
  background: #ffcef7;
  color: #790b68;
}

.box-3 {
  border-top: 9px solid #107526;
}


.box-4 {
}

.dashboard-box ul {
  margin: 0;
  padding: 0;
  margin-top: 15px;
}

.dashboard-box li {
  padding: 5px;
  list-style: none;
  display: flex;
  justify-content: space-between;
  margin-bottom: 7px;
  font-size: 13px;
  font-weight: 400;
  border-radius: 9px;
}

.dashboard-box li label {
  font-size: 13px;
  color: #42505C;
}

.dashboard-box li span i {
  -webkit-text-stroke: 1px;
}

.dashboard-box li label span {
  border-radius: 100%;
  width: 20px;
  color: #FFF;
  height: 20px;
  display: inline-block;
  text-align: center;
  padding: 2px 0;
  margin-right: 5px;
}


.cus-sele {
  width: 100%;
  height: 40px;
  border-radius: 10px;
  padding: 0 10px;
  color: #495057;
  min-height: 100%;
  border: 1px solid #ced4da;
  font-size: 14px;
}

.tick-icon {
  border-radius: 100%;
  width: 40px;
  height: 40px;
  display: inline-block;
  color: #fff;
}

.bgclr2 .tick-icon {
  background: #DE6E07;
}

.bgclr3 .tick-icon {
  background: #790b68;
}

.bgclr4 .tick-icon {
  background: #107526;
}

.category-box .dashboard-data div span i {
  font-size: 43px;
  position: relative;
  top: -4px;
  left: -3px;
}

.category-box .dashboard-box h1 {
  display: flex;
  align-items: center;
  gap: 15px;
  margin: 0;
}

.dsahboard-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.dsahboard-heading h1 {
  margin: 0;
}

.dsahboard-heading div {
  display: flex;
  /* gap: 10px; */
}



.monitering-box {
  padding-bottom: 0;
  overflow: hidden;
  background: linear-gradient(180deg, #ffffff, #f9fbfd);
  padding: 15px 20px 0;
  position: relative;
  padding-bottom: 42px;
}

.monitering-box h5 {
  text-align: center;
  margin: 0 -20px;
  font-style: normal;
  color: #Fff;
  padding: 13px 0;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.monitering-box h5 a {
  color: #fff
}

.monitering-cont {
  display: flex;
  justify-content: space-around;
  border-bottom: 2px dotted #7c7c7c;
}

.monitering-cont div p {
  color: #000;
  font-size: 13px;
  margin-bottom: 5px;
}

.monitering-cont div {
  text-align: center;
}

.monitering-cont div h4 {
  font-size: 23px;
  margin-bottom: 5px;
  font-weight: 600;
}

.monitering-value {
  display: flex;
  justify-content: space-around;
  gap: 15px;
  margin: 25px 0 15px 0;
}

.monitering-value div {
  text-align: center;
}

.monitering-value h6 {
  font-size: 23px;
}

.monitering-value p {
  line-height: 18px;
  margin: 15px 0;
  font-weight: 500;
}

.box-1 .sel-box {
  background: #DE6E07;
  color: #fff;
  border: 0;
}

.box-1 .monitering-cont div h4 {
  color: #DE6E07;
}

.box-1.monitering-box h5 {
  background: #DE6E07;
}

.box-1 .monitering-value h6 {
  color: #DE6E07;
  font-size: 23px;
}

.box-1 .monitering-value p {
  /* color: #000; */
}

.box-2 .sel-box {
  background: #790b68;
  color: #fff;
  border: 0;
}

.box-2 .monitering-cont div h4 {
  color: #790b68;
}

.box-2.monitering-box h5 {
  background: #790b68;
}

.box-2 .monitering-value h6 {
  color: #790b68;
}

.box-3 .sel-box {
  background: #107526;
  color: #fff;
  border: 0;
}

.box-3 .monitering-cont div h4 {
  color: #107526;
}

.box-3.monitering-box h5 {
  background: #107526;
}

.box-3 .monitering-value h6 {
  color: #107526;
}

.box-4 .sel-box {
  background: var( --new-primary-color);
  color: #fff;
  border: 0;
}

.box-4 .monitering-cont div h4 {
  color: var( --new-primary-color);
}

.box-4.monitering-box h5 {
  background: var( --new-primary-color);
}

.box-4 .monitering-value h6 {
  color: var( --new-primary-color);
}

.sel-box::-webkit-calendar-picker-indicator {
  filter: invert(1);
}

.sel-box {
  padding: 6px 10px !important;
  border-radius: 6px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  /* margin: 0 4px; */
}

.add-product {
  justify-content: start;
  flex-direction: row !important;
  margin: 0 -10px;
  padding: 0 15px;
  gap: 50px;
}

.add-product .nav-item.show .nav-link,
.add-product .nav-link.active {
  background: transparent !important;
  color: var( --new-primary-color) !important;
  border: oldlace;
  border-radius: 0;
  border-bottom: 5px solid var( --new-primary-color) !important;
}

.add-product .nav-link {
  color: #42505C;
  border-bottom: 5px solid transparent !important;
  font-weight: 500;
  border-radius: 10px 10px 0 0;
  background: #e7f2ff;
  font-size: 14px;
  padding: 7px 15px;
}

.add-product .nav-link:hover {
  border: none;
  border-bottom: 5px solid var( --new-primary-color) !important;
}


.import-summery-box {
  padding: 20px;
}

.import-summery-box i {

  color: #f00;

  font-size: 15px;
}

.import-summery-box h1 {
  font-size: 18px;
  text-transform: uppercase;
}

.import-summery-box .form-control {
  padding: 0;
}

.import-summery-error-box {
  background: #fff1f1;
  display: flex;
  gap: 10px;
  padding: 10px;
  margin-top: 30px;
  border-radius: 6px;
}

.import-summery-error-box h2 {
  font-size: 17px;
  margin-bottom: 10px;
  /* font-weight: 500; */
}

.import-summery-error-box p {
  font-size: 12px;
  margin-bottom: 5px;
}

.import-summery-box table {
  width: 60%;
  margin: 30px auto;
}

.import-summery-box table tr.total {

  font-weight: 500;
}

.import-summery-box table tr.total td span {
  color: transparent;
}

.import-summery-box table tr td {
  padding: 10px 0;
  text-align: left;
}

.summery-table table tr td i {
  cursor: pointer;
}

.import-summery-box table tr td span {
  /* margin-left: 40px; */
  color: green;
  font-size: 12px;
  margin-left: 10px;
}

.import-summery-box table tr td:nth-child(2) {
  /* text-align: right; */
}

.import-summery-box table tr {
  margin-left: 20px;
  box-shadow: none;
}

.import-summery-box button {
  width: auto;
  font-size: 11px;
  background: #2666fa;
  border: 0;
  color: #fff;
  padding: 10px 15px;
  line-height: 0;
}

.table-responsive h1,
.summery-table h1 {
  color: #5a5a5a;
  margin-bottom: 20px;
  font-size: 17px;
}

.scrape {
  margin: 50px 0;
  gap: 30px;
}

.scrape input,
.mng-web input,
.mng-web select {
  border: 0;
  box-shadow: 1px 1px 7px #0000001c;
  flex-grow: 1;
  height: 50px;
  border-radius: 9px;
  padding: 0 15px;
}

.mng-web hr {
  border: 1px solid #5e5e5e;
  margin: 35px 0;
}

.scrape button,
.mng-web button {
  border-radius: 7px;
  background: var( --new-primary-color);
  color: #fff;
  padding: 0 50px;
}

.scrape button:hover,
.mng-web button:hover {
  background: #245c9f;
}

.mng-web input,
.mng-web select {
  height: 40px;
}

.mng-web h1 {

  margin: 0;

  font-weight: 400;

  color: #5b5b5b;

  font-size: 17px;

  text-transform: initial;
}

.mng-web h4 {

  box-shadow: 1px 1px 7px #0000001c;

  border-radius: 9px;

  font-size: 14px;

  font-weight: 400;

  padding: 6px 14px;

  text-align: left;

  width: calc(50% - 0.5rem);

  color: var( --new-primary-color);
}

.mng-web h4 span {

  border-radius: 100%;

  border: 2px solid var( --new-primary-color);

  width: 18px;

  height: 18px;

  display: inline-block;

  text-align: center;

  float: right;

  font-weight: 600;

  font-size: 12px;
}

ul.table-sub-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  width: 130px;
  align-items: center;
}

ul.table-sub-menu li {
  display: inline-block;
}

ul.table-sub-menu li {
  padding: 0 5px;
  display: inline-block;
}

ul.table-sub-menu li i {
  -webkit-text-stroke: 0;
  color: var( --new-primary-color);
  font-size: 23px !important;
}


ul.table-sub-menu li.icon-disable i {
  color: #00000029;
  -webkit-text-stroke: 0;
}

.selected-categories {}

.selected-categories h1 {
  color: #42505C;
  font-size: 17px;
  margin-bottom: 15px;
}

.setting-menu-list {
  /* border: 1px solid #b9d9ff; */
}

.setting-menu-list span {
  background: #eef5ff;
  display: block;
  padding: 4px 10px 2px;
  color: #fff;
}

.setting-menu-list span label {
  color: #42505C;
}

.setting-menu-list h2 {
  color: #42505C;
  font-weight: 500;
  font-size: 17px;
  margin: 0;
}

.setting-menu-list p-multiSelect span {
  background: transparent;
  color: #7e7e7e;
  margin-top: -4px;
}

.moniter-type .form-check {
  margin: 20px 0;
}

.setting-menu-list select {
  width: 100%;
  border-color: #ccc;
  margin: 9px 0;
  color: #747474;
  height: 35px;
}

.sett-in {

  width: 100%;

  border: 1px solid #ccc;

  margin: 9px 0;

  color: #747474;

  padding: 5px 10px;

  font-size: 13px;

  height: 35px;
}

.sett-in::-webkit-calendar-picker-indicator {
  filter: invert(0) !important;
}




.selected-categories ul {
  padding: 0;
  display: flex;
  gap: 10px;
  flex-flow: wrap;
  margin-bottom: 35px;
  list-style: none;
}

.selected-categories ul li {}

.selected-categories ul li button {
  background: #ffffff;
  color: #000000;
  font-size: 13px;
  padding: 5px 10px;
  border-radius: 27px;
}

.selected-categories ul li button span {
  margin-left: 15px;
  color: #000;
  background: #d9d9d9;
  border-radius: 50%;
  height: 19px;
  width: 19px;
  display: inline-block;
  padding: 1px 0;
  text-align: center;
  font-size: 13px;
}

.import-export .selected-categories ul {
  flex-direction: row;
  gap: 40px;
  margin-top: 35px;
}

.import-export .selected-categories ul li {
  width: calc(32% - 20px);
  display: flex;
  align-items: center;
}

.import-export .selected-categories ul li input {
  margin: 0;
}

.import-export .selected-categories ul li label {
  margin-left: 10px;
  font-size: 13px;
  line-height: initial;
}

.import-export .selected-categories ul li label a {
  color: var( --new-primary-color);
  font-size: 13px;
  text-decoration: underline;
  margin-left: 10px;
}

.import-summery-box .selected-categories ul {}

.import-summery-box .selected-categories ul li {}

.import-summery-box .selected-categories ul li button {
  line-height: initial;
  background: #ebebeb;
  border-radius: 9px;
}

.import-summery-box .selected-categories ul li button span {}

.mng-web h4 span.name {
  border: 0;
  float: left;
  width: auto;
  height: auto;
  border-radius: 0;
  margin-right: 10px;
  color: #42505C;
  border-right: 2px solid #000;
  padding-right: 10px;
  position: relative;
  top: 2px;
}

.setting-menu {}

.setting-menu label {

  color: #565656;

  font-size: 17px;

  /* font-weight: 500; */
}

.form-check-input:checked {
  background-color: var( --new-primary-color);
  border-color: var( --new-primary-color);
}

.cus-model {
  --bs-modal-width: 60%;
}


.setting-acc .accordion-item {
  background: transparent;
  border: 0;
  padding-left: 16px;
}

.setting-acc .accordion-item span.acc-tag {
  position: absolute;
  top: 0;
  line-height: 0;
  z-index: 99;
  padding: 15px;
  border-radius: 6px;
  top: 8px;
  left: 0px;
}

.web-setting .accordion-item span.acc-tag {

  padding: 13px;

  border-radius: 6px;

  top: 8px;

  left: -15px;

  background: var( --new-primary-color) !important;
}

.setting-acc .accordion-item span.bg1 {
  background: #DE6E07;
}

.setting-acc .accordion-item span.bg2 {
  background: #790b68;
}

.setting-acc .accordion-item span.bg3 {
  background: #107526;
}

.fbg1:checked {
  background-color: #DE6E07;
  border-color: #DE6E07;
}

.fbg2:checked {
  background-color: #790b68;
  border-color: #790b68;
}

.fbg3:checked {
  background-color: #107526;
  border-color: #107526;
}

.setting-acc .accordion-item span.acc-tag i {
  color: #fff;
}

.setting-acc .accordion-header {
  position: relative;
}

.setting-acc .accordion-header button {
  margin-left: 25px !important;
  background: #fff;
  box-shadow: 0px 2px 11px #00000024 !important;
  margin: 30px 0 30px 0;
  padding: 20px 20px 20px 50px;
  width: calc(100% - 25px);
  border-radius: 5px !important;
}

.web-setting .accordion-header button {
  padding: 20px 20px 20px 46px !important;
}

.switch-acc {
  width: 100%;
}

.switch-acc .form-check {
  margin: 0;
  position: relative;
  top: 1px;
  padding-left: 0 !important;
}

.switch-acc .form-check input {
  float: right;
  margin-right: 20px;
}

.switch-acc .form-check label {

  font-size: 17px;

  color: #42505C;
}

.highlight-link {

  font-size: 13px;

  text-decoration: underline;

  margin-bottom: 15px;


}

.new-tbl-btn {
  color: #42505C;
  font-weight: 600;
  display: inline-block;
}

.highlight-link a {
  color: var( --new-primary-color);
}

.cap-lft {
  /* border: 2px solid #585858; */
  line-height: 0;
  padding: 3px 18px;
  border-radius: 30px 0 0 30px;
  background: var( --new-primary-color);
  color: #fff;
  width: 55px;
  height: 25px;
  line-height: 20px;
}

.cap-rit {
  /* border: 2px solid #585858; */
  line-height: 0;
  padding: 3px 18px;
  border-radius: 0 30px 30px 0;
  background: #4b96ef;
  color: #fff;
  border-left: 0;
  width: 55px;
  height: 25px;
  line-height: 20px;
}

.svp-table-inner-width .acc-table table {
  width: 700px;
}

.svp-table .accordion-table {
  box-shadow: none !important;
}

.acc-table {
  border: 0 !important;
  padding: 15px;
}

.acc-table table tr th {
  text-align: left;
}

.acc-table table {
  width: 97vw;
  min-width: auto;
  /* background: #f3f2ff !important; */
  padding: 0 5px !important;
  /* border: 0; */
  /* border-spacing: 0; */
  height: auto;
  border: 1px solid #e4e4e4;
  margin: 0;
}

.acc-table table tr td {
  font-size: 13px !important;
  background: transparent;
}

.assortment-box {
  display: flex;
  height: calc(100vh - 150px);
  border: 1px solid #f8fbff;
}

.assort-left-box {
  width: 400px;
  background: #f5f9ff;
}


.main-li-head {}

.main-li-head i {

  display: none;
}

.main-li-head li i {

  display: block;
}

.main-li-head h1 {

  font-size: 17px;

  margin: 0;

  padding: 20px 0;

  font-weight: 600;
}

.assort-right-box {
  width: calc(100% - 300px);
  padding: 0;
  position: relative;
}

.assort-right-box h1 {
  font-size: 23px;
  margin: 0;
}

.tree-assort {
  margin: 0;
  padding: 0;
  list-style: none;
}

.tree-assort ul {
  margin: 0;
  padding: 0;
  list-style: none;
  margin-left: 1em;
  position: relative;
}

.tree-assort ul ul {
  margin-left: 0.5em;
}

.tree-assort ul:before {
  content: "";
  display: block;
  width: 0;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  border-left: 4px solid #dee2e6;
}

.tree-assort ul li:before {
  content: "";
  display: block;
  width: 15px;
  height: 0;
  border-top: 4px solid #dee2e6;
  margin-top: 0px;
  position: absolute;
  top: 20px;
  left: 0px;
}

.tree-assort ul li:last-child:before {
  background: #f8fbff;
  height: auto;
  top: 1em;
  bottom: 0;
}

.tree-assort li {
  margin: 0;
  padding: 0px 10px 0px 20px;
  line-height: 2em;
  color: #336699;
  font-weight: 600;
  position: relative;
}

.tree-assort li .expand li a {
  color: #686868;
}

.tree-assort li i {
  float: left;
  margin-top: 7px;
}

.tree-assort li .expand {
  display: block;
}



.tree-assort li ul.expand li.branch ul.expand li a {
  color: #686868;
}

.tree-assort li .collapse {
  display: none;
}

.tree-assort li.active,
.tree-assort li:hover {
  border-radius: 0;
  background: transparent;
}

.tree-assort li.active a,
.tree-assort li a:hover {

  color: #000000 !important;

  background: #dbebff;

  border-radius: 5px;
}

.tree-assort li.active a::before,
.tree-assort li:hover a::before {
  background: #fff;
}

.tree-assort li a {
  text-decoration: none;
  color: #369;
  padding: 6px 0px 6px 10px;
  display: block;
  /* width: 100%; */
  font-size: 15px;
}

.tree-assort li a::before {

  content: '';

  display: inline-block;

  width: 7px;

  height: 7px;

  background: var( --new-primary-color);

  border-radius: 100%;

  margin-right: 10px;

  display: none;
}

.tree-assort li.active::after {

  content: "\F231";

  margin-right: 10px;

  display: inline-block;

  font-family: bootstrap-icons !important;

  font-style: normal;

  font-weight: normal !important;

  font-variant: normal;

  text-transform: none;

  line-height: 1;

  vertical-align: -0.125em;

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  display: none;

}

.tree-assort li ul li {
  color: #686868
}

.tree-assort li button {
  text-decoration: none;
  color: #369;
  border: none;
  background: transparent;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  outline: 0;
}

.tree-assort li button:active {
  text-decoration: none;
  color: #369;
  border: none;
  background: transparent;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  outline: 0;
}

.tree-assort li button:focus {
  text-decoration: none;
  color: #369;
  border: none;
  background: transparent;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  outline: 0;
}

.indicator {
  margin-right: 5px;
}

.branch i {
  margin-right: 10px;
  color: #369;
}

.over-scrl {
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}

::-webkit-scrollbar {
  width: 5px;
  height: 4px;
}

.assort-facet .accordion-item span.acc-tag {
  top: 7px;
  left: -7px;
}

.over-scrl::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.over-scrl::-webkit-scrollbar-thumb {
  background: #369;
}

.over-scrl::-webkit-scrollbar-thumb:hover {
  background: #555;
}


.assort-nav {
  position: absolute;
  background: #ffffff;
  z-index: 999;
  top: 0;
  right: 0;
  left: 0;
}

.assort-nav .add-product {
  margin: 0;
}

.color-box {
  background: #f8f8f899;
  box-shadow: 1px 1px 6px #00000014;
  border-radius: 8px;
  padding-bottom: 2px;
  overflow: hidden;
}

.color-box .clr-heading {
  text-align: center;
  padding: 5px 0;
  border-bottom: 1px solid #93b2d7;
  background: #DE6E07;
  display: none;
}

.color-box .clr-heading h1 {
  margin: 0;
  color: #ffffff;
  font-size: 25px;
}

.color-box .clr-heading span {
  color: #ffffff;
  font-size: 13px;
}

.color-box ul {
  margin: 0;
  padding: 0;
  display: flex;
  gap: 15px 15px;
  flex-wrap: wrap;
  flex-direction: row;
  margin: 30px 10px;
  justify-content: center;
}

.color-box ul li {
  list-style: none;
  width: 22%;
  padding: 10px;
}

.color-box ul li a {
  display: block;
  text-align: center;
}

.color-box ul li a .img {
  width: 40px;
  height: 40px;
  overflow: hidden;
  border-radius: 100%;
  margin: 0 auto;
}

.color-box ul li.active {
  background: #fdd8d880;
  border-radius: 4px;
}

.color-box ul li.active a span {
  color: #000
}

.color-box ul li a .img h1 {

  margin-bottom: 0;

  background: #bfffcd;

  color: #107526;
}

.color-box ul li a span {
  color: #DE6E07;
  font-size: 12px;
  line-height: 19px;
  display: inline-block;
  margin-top: 10px;
}

.shape-box .color-box ul li {
  width: 29%;
}

.shape-box .color-box ul li a .img {
  border-radius: 0;

}

.shape-box .color-box .clr-heading {
  background: #790b68;
}

.shape-box .color-box ul li a span {
  color: #790b68
}

.display-type .color-box .clr-heading {
  background: #107526;
}

.display-type .color-box ul li a span {
  color: #107526
}

.dropdown-toggle::after {
  display: block;
  width: 6px;
  height: 6px;
  border-top: 2px solid #a0a0a0;
  border-left: 2px solid #a0a0a0;
  transform: rotate(225deg);
  margin-left: 0;
  vertical-align: 0;
  border-right: 0;
}

.brand-box {
  display: flex;
  gap: 20px;
  align-items: center;
  padding: 10px 10px;
  border-bottom: 1px solid #ebebeb;
  border-radius: 0;
}

.brand-box:hover {
  background: #f9e7b7;
}

.brand-box img {
  width: 80px;
}

.brand-box .brand-header {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-left: 20px;
}

.brand-box .brand-header h1 {
  margin: 0;
  font-size: 14px;
  font-weight: 400;
}

.summary-div {

  display: flex;

  align-items: center;

  gap: 15px;

  word-wrap: break-word;

  margin-bottom: 0px;

  padding: 10px;
}

.summary-div img {

  width: 125px;
}

.summary-div div {

  width: calc(100% - 130px);
}

.summary-div div h2 {

  color: #42505C;

  font-size: 14px;

  margin-bottom: 6px;
}

.summary-div div p {

  margin: 0;

  font-size: 12px;

  line-height: 19px;

  color: #616161;
}

.das-table {}

.das-table table tbody tr td {
  padding: 10px 10px;
}

.das-table img {
  width: 125px;
}

.brand-box:hover .brand-header h1 {
  color: #42505C;
}

.col-filter {
  position: relative;
  background: var( --new-primary-color);
  box-shadow: 1px 1px 1px #00000045;
  color: #fff;
  width: 25px;
  height: 25px;
  display: inline-block;
  text-align: center;
  border-radius: 4px;
  cursor: pointer;
}

.col-filter i {

  line-height: 27px;
}

.show-hide {

  position: absolute;

  background: #ffffff;

  top: 0;

  right: 47px;

  padding: 0;

  box-sizing: border-box;

  box-shadow: 0px 1px 6px var( --new-primary-color)82;

  display: none;

  z-index: 999;
}

.show-hide ul::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}

.show-hide ul::-webkit-scrollbar-track {
  background: #e4e3ff;
}

.show-hide ul::-webkit-scrollbar-thumb {
  background: var( --new-primary-color);
}

.show-hide ul::-webkit-scrollbar-thumb:hover {
  background: var( --new-primary-color);
}

.show-hide h1 {
  font-size: 15px;
  padding: 10px 20px;
  margin: 0;
  background: #f3f2ff;
}

.show-hide ul {
  list-style: none;
  padding: 0 20px;
  margin: 0;
  overflow: auto;
  height: auto;
  width: 280px;
  max-height: 400px;
}

.show-hide ul li {
  color: #4e4e4e;
  font-size: 15px;
  font-weight: 400;
  margin: 15px 0;
}






@media screen and (min-width: 768px) {
  .dashboard-body {
    margin: 0;
    padding-left: calc(var(--nav-width) + 0rem);
  }

  .header-old {
    height: 50px;
    /* padding: 0 2rem 0 calc(var(--nav-width) + 2rem); */
  }

  .header-old_img {
    width: 40px;
    height: 40px
  }

  .header-old_img img {
    width: 45px
  }

  .l-navbar {
    left: 0;
    /* padding: .5rem 1rem; */
  }

  .menu-show {
    width: calc(var(--nav-width) - 162px);
  }

  .body-pd {
    padding-left: calc(var(--nav-width) - 162px);
  }
}


/*!
 * Bootstrap-select v1.14.0-beta2 (https://developer.snapappointments.com/bootstrap-select)
 *
 * Copyright 2012-2021 SnapAppointments, LLC
 * Licensed under MIT (https://github.com/snapappointments/bootstrap-select/blob/master/LICENSE)
 */
@-webkit-keyframes bs-notify-fadeOut {
  0% {
    opacity: .9
  }

  100% {
    opacity: 0
  }
}

@-o-keyframes bs-notify-fadeOut {
  0% {
    opacity: .9
  }

  100% {
    opacity: 0
  }
}

@keyframes bs-notify-fadeOut {
  0% {
    opacity: .9
  }

  100% {
    opacity: 0
  }
}

.bootstrap-select>select.bs-select-hidden,
select.bs-select-hidden,
select.selectpicker {
  display: none !important
}

.bootstrap-select {
  width: 220px\0;
  vertical-align: middle
}

.bootstrap-select>.dropdown-toggle {
  position: relative;
  width: 100%;
  text-align: right;
  white-space: nowrap;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  border-color: #ccc;
  margin: 3px 0;
  color: #747474;
  padding: 5px 10px;
  background: #fff;
  border-radius: 30px;
}

.bootstrap-select>.dropdown-toggle:after {
  margin-top: -1px;
}

.bootstrap-select>.dropdown-toggle.bs-placeholder,
.bootstrap-select>.dropdown-toggle.bs-placeholder:active,
.bootstrap-select>.dropdown-toggle.bs-placeholder:focus,
.bootstrap-select>.dropdown-toggle.bs-placeholder:hover {
  color: #747474;
  font-weight: 400;
  font-size: 14px;
}

.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-danger,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-danger:active,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-danger:focus,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-danger:hover,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-dark,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-dark:active,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-dark:focus,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-dark:hover,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-info,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-info:active,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-info:focus,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-info:hover,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-primary,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-primary:active,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-primary:focus,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-primary:hover,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-secondary,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-secondary:active,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-secondary:focus,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-secondary:hover,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-success,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-success:active,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-success:focus,
.bootstrap-select>.dropdown-toggle.bs-placeholder.btn-success:hover {
  color: rgba(255, 255, 255, .5)
}

.bootstrap-select>select {
  position: absolute !important;
  bottom: 0;
  left: 50%;
  display: block !important;
  width: .5px !important;
  height: 100% !important;
  padding: 0 !important;
  opacity: 0 !important;
  border: none;
  z-index: 0 !important
}

.bootstrap-select>select.mobile-device {
  top: 0;
  left: 0;
  display: block !important;
  width: 100% !important;
  z-index: 2 !important
}

.bootstrap-select.is-invalid .dropdown-toggle,
.error .bootstrap-select .dropdown-toggle,
.has-error .bootstrap-select .dropdown-toggle,
.was-validated .bootstrap-select select:invalid+.dropdown-toggle {
  border-color: #b94a48
}

.bootstrap-select.is-valid .dropdown-toggle,
.was-validated .bootstrap-select select:valid+.dropdown-toggle {
  border-color: #28a745
}

.bootstrap-select.fit-width {
  width: auto !important
}

.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
  width: 100%;
  /* width: 100%; */
  /* border-color: #ccc; */
  /* margin: 10px 0; */
  /* color: #747474; */
}

.bootstrap-select .dropdown-toggle:focus,
.bootstrap-select>select.mobile-device:focus+.dropdown-toggle {
  outline: thin dotted #333 !important;
  outline: 5px auto -webkit-focus-ring-color !important;
  outline-offset: -2px
}

.bootstrap-select.form-control {
  margin-bottom: 0;
  padding: 0;
  border: none;
  height: auto
}

:not(.input-group)>.bootstrap-select.form-control:not([class*=col-]) {
  width: 100%
}

.bootstrap-select.form-control.input-group-btn {
  float: none;
  z-index: auto
}

.form-inline .bootstrap-select,
.form-inline .bootstrap-select.form-control:not([class*=col-]) {
  width: auto
}

.bootstrap-select:not(.input-group-btn),
.bootstrap-select[class*=col-] {
  float: none;
  display: inline-block;
  margin-left: 0;
  padding: 0;
  margin: 5px 0px;
  font-size: 14px;
  font-weight: 400;
}

.bootstrap-select.dropdown-menu-right,
.bootstrap-select[class*=col-].dropdown-menu-right,
.row .bootstrap-select[class*=col-].dropdown-menu-right {
  float: right
}

.form-group .bootstrap-select,
.form-horizontal .bootstrap-select,
.form-inline .bootstrap-select {
  margin-bottom: 0
}

.form-group-lg .bootstrap-select.form-control,
.form-group-sm .bootstrap-select.form-control {
  padding: 0
}

.form-group-lg .bootstrap-select.form-control .dropdown-toggle,
.form-group-sm .bootstrap-select.form-control .dropdown-toggle {
  height: 100%;
  font-size: inherit;
  line-height: inherit;
  border-radius: inherit
}

.bootstrap-select.form-control-lg .dropdown-toggle,
.bootstrap-select.form-control-sm .dropdown-toggle {
  font-size: inherit;
  line-height: inherit;
  border-radius: inherit
}

.bootstrap-select.form-control-sm .dropdown-toggle {
  padding: .25rem .5rem
}

.bootstrap-select.form-control-lg .dropdown-toggle {
  padding: .5rem 1rem
}

.form-inline .bootstrap-select .form-control {
  width: 100%
}

.bootstrap-select.disabled,
.bootstrap-select>.disabled {
  cursor: not-allowed
}

.bootstrap-select.disabled:focus,
.bootstrap-select>.disabled:focus {
  outline: 0 !important
}

.bootstrap-select.bs-container {
  position: absolute;
  top: 0;
  left: 0;
  height: 0 !important;
  padding: 0 !important
}

.bootstrap-select.bs-container .dropdown-menu {
  z-index: 1060
}

.bootstrap-select .dropdown-toggle .filter-option {
  position: static;
  top: 0;
  left: 0;
  float: left;
  height: 100%;
  width: 100%;
  text-align: left;
  overflow: hidden;
  -webkit-box-flex: 0;
  -webkit-flex: 0 1 auto;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto
}

.bs3.bootstrap-select .dropdown-toggle .filter-option {
  padding-right: inherit
}

.input-group .bs3-has-addon.bootstrap-select .dropdown-toggle .filter-option {
  position: absolute;
  padding-top: inherit;
  padding-bottom: inherit;
  padding-left: inherit;
  float: none
}

.input-group .bs3-has-addon.bootstrap-select .dropdown-toggle .filter-option .filter-option-inner {
  padding-right: inherit
}

.bootstrap-select .dropdown-toggle .filter-option-inner-inner {
  overflow: hidden;
  font-size: 14px;
}

.bootstrap-select .dropdown-toggle .filter-expand {
  width: 0 !important;
  float: left;
  opacity: 0 !important;
  overflow: hidden
}

.bootstrap-select .dropdown-toggle .caret {
  position: absolute;
  top: 50%;
  right: 12px;
  margin-top: -2px;
  vertical-align: middle
}

.bootstrap-select .dropdown-toggle .bs-select-clear-selected {
  position: relative;
  display: block;
  margin-right: 5px;
  text-align: center
}

.bs3.bootstrap-select .dropdown-toggle .bs-select-clear-selected {
  padding-right: inherit
}

.bootstrap-select .dropdown-toggle .bs-select-clear-selected span {
  position: relative;
  top: -webkit-calc(((-1em / 1.5) + 1ex)/ 2);
  top: calc(((-1em / 1.5) + 1ex)/ 2);
  pointer-events: none
}

.bs3.bootstrap-select .dropdown-toggle .bs-select-clear-selected span {
  top: auto
}

.bootstrap-select .dropdown-toggle.bs-placeholder .bs-select-clear-selected {
  display: none
}

.input-group .bootstrap-select.form-control .dropdown-toggle {
  border-radius: inherit
}

.bootstrap-select[class*=col-] .dropdown-toggle {
  width: 100%
}

.bootstrap-select .dropdown-menu {
  min-width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}

.bootstrap-select .dropdown-menu>.inner:focus {
  outline: 0 !important
}

.bootstrap-select .dropdown-menu.inner {
  position: static;
  float: none;
  border: 0;
  padding: 0;
  margin: 0;
  border-radius: 0;
  -webkit-box-shadow: none;
  box-shadow: none
}

.bootstrap-select .dropdown-menu li {
  position: relative
}

.bootstrap-select .dropdown-menu li.active small {
  color: rgba(255, 255, 255, .5) !important
}

.bootstrap-select .dropdown-menu li.disabled a {
  cursor: not-allowed
}

.bootstrap-select .dropdown-menu li a {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.bootstrap-select .dropdown-menu li a.opt {
  position: relative;
  padding-left: 2.25em
}

.bootstrap-select .dropdown-menu li a span.check-mark {
  display: none
}

.bootstrap-select .dropdown-menu li a span.text {
  display: inline-block
}

.bootstrap-select .dropdown-menu li small {
  padding-left: .5em
}

.bootstrap-select .dropdown-menu .notify {
  position: absolute;
  bottom: 5px;
  width: 96%;
  margin: 0 2%;
  min-height: 26px;
  padding: 3px 5px;
  background: #f5f5f5;
  border: 1px solid #e3e3e3;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
  pointer-events: none;
  opacity: .9;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}

.bootstrap-select .dropdown-menu .notify.fadeOut {
  -webkit-animation: .3s linear 750ms forwards bs-notify-fadeOut;
  -o-animation: .3s linear 750ms forwards bs-notify-fadeOut;
  animation: .3s linear 750ms forwards bs-notify-fadeOut
}

.bootstrap-select .no-results {
  padding: 3px;
  background: #f5f5f5;
  margin: 0 5px;
  white-space: nowrap
}

.bootstrap-select.fit-width .dropdown-toggle .filter-option {
  position: static;
  display: inline;
  padding: 0
}

.bootstrap-select.fit-width .dropdown-toggle .filter-option-inner,
.bootstrap-select.fit-width .dropdown-toggle .filter-option-inner-inner {
  display: inline
}

.bootstrap-select.fit-width .dropdown-toggle .bs-caret:before {
  content: '\00a0'
}

.bootstrap-select.fit-width .dropdown-toggle .caret {
  position: static;
  top: auto;
  margin-top: -1px
}

.bootstrap-select.show-tick .dropdown-menu .selected span.check-mark {
  position: absolute;
  display: inline-block;
  right: 15px;
  top: 5px;
  background: transparent;
  color: var( --new-primary-color);
}

.bootstrap-select.show-tick .dropdown-menu li a span.text {
  margin-right: 34px;
  background: transparent;
  color: #42505C;
}

.bootstrap-select .bs-ok-default:after {
  content: '';
  display: block;
  width: .5em;
  height: 1em;
  border-style: solid;
  border-width: 0 .26em .26em 0;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg)
}

.bootstrap-select.show-menu-arrow.open>.dropdown-toggle,
.bootstrap-select.show-menu-arrow.show>.dropdown-toggle {
  z-index: 1061
}

.bootstrap-select.show-menu-arrow .dropdown-toggle .filter-option:before {
  content: '';
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid rgba(204, 204, 204, .2);
  position: absolute;
  bottom: -4px;
  left: 9px;
  display: none
}

.bootstrap-select.show-menu-arrow .dropdown-toggle .filter-option:after {
  content: '';
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #fff;
  position: absolute;
  bottom: -4px;
  left: 10px;
  display: none
}

.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle .filter-option:before {
  bottom: auto;
  top: -4px;
  border-top: 7px solid rgba(204, 204, 204, .2);
  border-bottom: 0
}

.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle .filter-option:after {
  bottom: auto;
  top: -4px;
  border-top: 6px solid #fff;
  border-bottom: 0
}

.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle .filter-option:before {
  right: 12px;
  left: auto
}

.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle .filter-option:after {
  right: 13px;
  left: auto
}

.bootstrap-select.show-menu-arrow.open>.dropdown-toggle .filter-option:after,
.bootstrap-select.show-menu-arrow.open>.dropdown-toggle .filter-option:before,
.bootstrap-select.show-menu-arrow.show>.dropdown-toggle .filter-option:after,
.bootstrap-select.show-menu-arrow.show>.dropdown-toggle .filter-option:before {
  display: block
}

.bs-actionsbox,
.bs-donebutton,
.bs-searchbox {
  padding: 4px 8px
}

.bs-actionsbox {
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}

.bs-actionsbox .btn-group {
  display: block
}

.bs-actionsbox .btn-group button {
  width: 50%
}

.bs-donebutton {
  float: left;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}

.bs-donebutton .btn-group {
  display: block
}

.bs-donebutton .btn-group button {
  width: 100%
}

.bs-searchbox+.bs-actionsbox {
  padding: 0 8px 4px
}

.bs-searchbox .form-control {
  margin-bottom: 0;
  width: 100%;
  float: none
}



.offcanvas-header {
  background: #f8f8f8;
}

button:focus:not(:focus-visible) {
  box-shadow: none;
  /* background: #000; */
}

.product-cat {

  padding: 15px 15px;

  border-bottom: 1px solid #0000003b;

  border-radius: 8px 8px 0 0;
}

.product-cat h6 {
  font-size: 20px !important;
}

.product-cat .monitering-value {

  justify-content: space-between;

  gap: 0;

  margin: 0;
}

.product-cat .monitering-value div {

  width: 50%;
}

.product-cat .monitering-value div:first-child {
  border-right: 1px solid #ccc;
}

.product-cat .monitering-value div p {
  margin: 0;
}

.product-cat .monitering-value div h6 {
  margin: 0;
  margin-top: 5px;
}

.stock-listing {
  margin: 0;
  display: flex;
  align-items: center;
}

.stock-listing h1 {
  gap: 10px !important;
  font-size: 13px;
}

.stock-listing span {
  background: #000;
  height: 35px;
  width: 35px;
  border-radius: 100%;
  display: inline-block;
}

.stock-listing span i {

  font-size: 35px !important;

  color: #fff;

  position: relative;

  top: -2px !important;

  left: 0px !important;
}

.stock-listing span.green {

  background: #107526;
}

.stock-listing span.red {

  background: #f31212;
}

.item-badges {}

.item-badges ul {
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: space-between;
}

.item-badges ul li {
  background: #107526;
  color: #fff;
  border-radius: 0;
  padding: 8px 40px;
  position: relative;
}

.item-badges ul li::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 0;
  height: 0;
  border-right: 15px solid white;
  border-top: 17px solid transparent;
  border-bottom: 17px solid transparent;
}

.sticky-menu {
  background: var( --new-primary-color)00;
  position: sticky;
  z-index: 9999;
  top: 0;
  height: 0;
  overflow: hidden;
  transition: 0.3s;
}

.sticky-menu ul {
  padding: 0;
  display: flex;
  justify-content: space-evenly;
}

.sticky-menu ul li {
  list-style: none;
  width: 33.3%;
  text-align: center;
}

.sticky-menu ul li a {
  color: #fff;
  padding: 20px 0;
  display: inline-block;
  font-size: 16px;
}

.screenshot-img {

  display: flex;

  flex-wrap: wrap;

  gap: 15px;

  padding: 0 15px;
}

.screenshot-img div {
  flex: calc(33% - 10px);
  background: #e8e8e8;
  padding: 2px 2px 0 2px;
  border-radius: 6px;
}

.screenshot-img div img {}

.screenshot-img div p {

  margin-bottom: 0;

  display: flex;

  justify-content: space-between;

  padding: 5px;
}

.screenshot-img div p span {
  color: #42505C;
}

.screenshot-img div p span i {
  -webkit-text-stroke: 1px;
  color: #2666fa;
}


.box {
  width: 100%;
  text-align: center;
}

.box h2 {
  display: block;
  text-align: center;
  color: #42505C;
  font-size: 13px;
  margin-top: 15px;
}

.box .chart,
.box .chart1,
.box .chart2 {
  position: relative;
  height: 100%;
  text-align: center;
  font-size: 20px;
  line-height: 60px;
  height: 60px;
  width: 60px;
  margin: 0 auto;
  padding: 0;
}

.chart {
  color: #ff6464
}

.chart1 {
  color: #ffc940
}

.chart2 {
  color: #36c956
}

.box canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  width: 100%;
}

.progress {
  width: 120px;
  margin: 0 auto;
  position: relative;
  height: 22px;
  border-radius: 6px;
  display: flex !important;
}

.progress-bar {
  border-radius: 6px;
}

.progress span {
  color: #fff;
  position: absolute;
  left: 6px;
  top: 0px;
}

.progress-bg1,
.bg-inprogress {
  background: #efaf09 !important;
}

.progress-bg2 {
  background: #ff6464 !important;
}

.progress-bg3 {
  background: #36c956 !important;
}

.clr-1 {
  color: #efaf09 !important;
}

.clr-2 {
  color: #ff6464 !important;
}

.clr-3 {
  color: #36c956 !important;
}

.bg-red {
  background: hwb(0 0% 0%) !important;
}

.bg-gren {
  background: hwb(133.06deg 21.18% 21.18%);
}

.audit-tab {
  flex-wrap: nowrap;
  font-size: 14px;
  gap: 10px;
  background: #ffffff;
  margin: 0;
  padding: 0;
  border: 0;
}

.audit-tab .nav-link {
  color: #000000d1;
}

.audit-tab .nav-item.show .nav-link,
.audit-tab .nav-link.active,
.audit-tab .nav-link:hover {

  border-bottom-color: #074a9b !important;

  color: #fff !important;

  background: var( --new-primary-color) !important;

  border-radius: 0 !important;

  border-radius: 10px 10px 0 0 !important;
}

.tab-content {
  /* background: #ffffff; */
  /* padding: 10px; */
  /* border: 1px solid #e7e7e7; */
  margin-top: -2px;
  z-index: 9;
  position: relative;
  padding-bottom: 0;
}

.audit-tab-tab-content {
  border: 1px solid #e3e3e3;
  margin-top: 0px;
  padding: 15px;
  border-top: 0;
}

.audit-acc .accordion-item span.acc-tag {

  display: none;
}

.setting-acc .accordion-header button {

  margin-left: 0 !important;

  width: 100%;

  padding: 20px 15px 20px 40px !important;
}

.audit-acc .accordion-header {
  margin: -10px 0 !important;
}

.audit-acc .accordion-button::after {

  position: absolute;

  left: 8px;

  border-radius: 100%;

  color: #fff;

  z-index: 99999;

  background-size: 14px;

  background-position: center;
}

.audit-right {
  float: right;
  font-size: 12px;
  display: inline-block;
  padding: 3px 10px;
  border-radius: 3px;
  color: #42505C;
  min-width: 65px;
  text-align: center;

}

h1.tab-head {
  font-size: 14px;
  margin: 0;
  padding: 10px 10px;
  background: #bddbff;
  font-weight: 400;
  line-height: 24px;
}

h2.tab-head {
  font-size: 14px;
  margin: 0;
  padding: 10px 10px;
  background: #bddbff;
  font-weight: 400;
  line-height: 24px;
  color: #000;
}

ul.bullet-tab-head {
  background: #bddbff;
  margin: 0;
  padding: 10px 10px;
}

ul.bullet-tab-head li {
  font-size: 14px;
  margin: 0;
  padding: 5px 0px;
}

ul.audit-tab-list {

  margin: 0;

  list-style: auto;

  padding: 0 10px;
}

ul.audit-tab-list li {

  padding: 10px 0;

  display: flex;

  justify-content: space-between;

  gap: 9px;

  border-bottom: 1px solid #e2e2e2;

  align-items: center;

  font-size: 14px;
}

ul.audit-tab-list li span {
  width: calc(100% - 50px);
}

ul.audit-tab-list li span.right-circle {
  border-radius: 6px;
  width: 40px;
  text-align: center;
  color: #fff;
  font-size: 11px;
  line-height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

ul.audit-tab-list li span.right-circle i {
  color: #fff;
  font-size: 19px;
  text-align: center;
}

.overall-box {
  padding: 20px 0;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  margin: 27px 0;
  background: #f4f4f4;
}

a.facet {
  color: #ccc;
  font-size: 12px;
  position: relative;
  top: -8px;
  left: 2px;
}

.form-check {
  text-align: left;
}



.td-rating {
  display: flex;
  gap: 10px;
  justify-content: left;
}

.td-rating span {width: 22px;}

.td-rating span img {
  width: 100%;
}

.td-rating span h1 {
  margin: 0;
  font-size: 12px;
  font-weight: 400;
}

td.td-review {}

.td-pro {
  width: 200px;
  height: 30px;
  border-radius: 0;
  margin-right: 10px;
}

td.td-review .progress-bar {
  border-radius: 0;
}

.senti-alys {
  padding: 15px;
}

.senti-alys ul {
  padding: 0;
  list-style: none;
}

.senti-alys ul li {
  display: flex;
  align-items: center;
  gap: 15px;
  margin: 40px 0;
}

.senti-alys ul li:first-child {
  margin-top: 10px;
}

.senti-alys ul li:last-child {
  margin-bottom: 0;
}

.senti-alys ul li h1 {
  width: 30%;
  font-size: 13px;
  font-weight: 400;
  color: #000000;
}

.senti-alys ul li .progress-box {
  width: 70%;
}

.senti-alys ul li .progress-box label {
  margin-right: 10px;
  font-size: 15px;
  font-weight: 500;
  width: 25px;
}

.senti-alys ul li .progress-box label.end {
  margin-right: 0;
  margin-left: 10px;
}

.senti-alys ul li .progress-box .progress {
  align-items: center;
  width: 100%;
  display: flex;
  background: transparent;
  height: 30px;
}

.senti-alys ul li .progress-box .progress .progress-bar {
  border-radius: 0;
  height: 100%;
}

.drawer-divid-list {
  width: 50%;
  padding: 10px 15px;
  border-right: 1px solid #f0f0f0;
}

.modal-dialog {
  max-width: 900px;
}

.model-product {
  display: flex;
  align-items: center;
  gap: 30px;
}

.model-product img.logo {
  max-width: 100px;
  width: auto;
  max-height: 100px;
}

.model-product h1 {
  color: #000;
  font-size: 14px;
}

.model-product h6 {
  font-weight: 500;
  font-style: italic;
  color: #c2c2c2;
  font-size: 13px;
}

.cus-btn-close {
  position: absolute;
  top: 10px;
  right: 10px;
}

.review-box {
  padding: 15px 0px;
  border-bottom: 1px solid #ccc;
}

.review-box p {
  font-size: 13px;
  margin: 0;
  font-weight: 300;
  color: #606060;
}

.review-box .name {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.review-box .name h1 {
  font-size: 16px;
  margin: 0;
}

.review-box .name p {
  color: #a3a3a3;
  margin: 0;
  font-size: 13px;
}

.review-box .td-rating {
  margin: 12px 0;
  gap: 5px;
  justify-content: flex-start;
}

.review-box .td-rating span {
  width: 15px;
}

.review-box .td-rating span img {
  width: 100%;
}

.pro-img {
  max-height: 175px;
  width: auto;
}

.carousel-control-next-icon,
.carousel-control-prev-icon {

  background-color: #000;
}




.ellipsis-content {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: initial;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  margin: 0;
}

.p-calendar {
  width: 100%;
}

.p-button {
  background: var( --new-primary-color) !important;
}

.bx-package {
  font-size: 23px !important;
}

.layout-footer {
  /* position: absolute; */
  bottom: 0;
  left: 0;
  right: 0;
  height: 40px;
}

.footer-bottom {
  text-align: center;
  padding: 10px;
  background: #f3f3f3;
  z-index: 9;
  position: relative;
}

.footer-bottom p {
  margin: 0;
  font-size: 14px;
  color: #6c6c6c;
}

.p-inputtext {
  padding: 0.5rem !important;
  background: transparent !important;
  font-size: 15px !important;
  box-shadow: none !important;
}

.p-button.p-button-icon-only {
  padding: 0.45rem 0 !important;
}

.p-dropdown .p-dropdown-trigger {
  background: #f8fbff !important;
}

.input-group-text {
  /* background: #f8fbff !important; */
}



.th-head {
  display: flex
}

.p-datatable .p-datatable-tbody>tr>td,
.p-datatable .p-datatable-thead>tr>th {
  white-space: nowrap;
  /* padding: 1rem 1rem !important; */
}

.td-category {
  width: 200px
}

.th-icon {
  visibility: hidden;
}

.p-datatable .p-datatable-thead>tr>th:hover .th-icon {
  visibility: visible;
}

.p-datatable .p-sortable-column .p-sortable-column-icon {
  font-size: 12px !important;
}

.pi {
  font-size: 11px !important;
}

.p-datatable .p-datatable-tbody>tr>td {}

.p-datatable .p-datatable-tbody>tr>td span {
  display: inline-block;
}

.search-input {
  border-bottom: 1px solid #afafaf;
  background: transparent !important;
}

.search-input span {
  background: transparent !important;
}

.search-input input:focus {
  box-shadow: none;
}

.p-datatable .p-datatable-tbody>tr {
  box-shadow: 1px 1px 3px #00000036;
  vertical-align: middle;
}

.p-checkbox,
.p-checkbox .p-checkbox-box {
  width: 16px !important;
  height: 16px !important;
  border-radius: 4px !important;
}

.p-checkbox .p-checkbox-box.p-highlight {
  border-color: var( --new-primary-color) !important;
  background: var( --new-primary-color) !important;
}

.p-datatable>.p-datatable-wrapper {
  overflow: inherit !important;
  height: calc(100vh - 225px);
}

.field-checkbox {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}

.field-checkbox p {
  margin: 0;
  line-height: 1;
}

.field-checkbox input {
  border: 0;
  border-bottom: 1px solid #bebebe;
  font-size: 13px;
}

.field-checkbox input[type=text] {
  width: 100%
}

.field-checkbox input:focus-visible {
  border: 0;
  border-bottom: 1px solid var( --new-primary-color);
  outline: none;
}

.scroll-min-height {
  max-height: 300px;
  overflow-y: auto;
  margin-bottom: 15px;
}

.scroll-min-height::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}

.scroll-min-height::-webkit-scrollbar-track {
  background: #e4e3ff;
}

.scroll-min-height::-webkit-scrollbar-thumb {
  background: var( --new-primary-color);
}

.scroll-min-height::-webkit-scrollbar-thumb:hover {
  background: var( --new-primary-color);
}

.common-btn {
  background: var( --new-primary-color) !important;
  border-radius: 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #fff !important;
  padding: 11px 19px !important;
  display: flex !important;
  align-items: center;
  gap: 7px;
  transition: 1s !important;
}

.outline-btn {
  border: 1px solid var( --new-primary-color);
  background: #fff !important;
  color: var( --new-primary-color) !important;
  box-shadow: none;
}

.download-btn {
  background: linear-gradient(141deg, #2eb92f, #6bf86c) !important;
}

.common-btn:hover {
  background: var(--cus-btn-color-hover) !important;
  color: #fff !important;
}

.download-btn:hover {
  background: #2eb92f !important;
}

.p-column-filter-buttonbar {
  display: none !important;
}

.p-datatable .p-datatable-thead>tr>th {
  background: #f3f2ff !important;
  text-transform: uppercase;
  padding: .5rem 1rem !important;
}

.p-column-filter-menu-button:hover {
  background: transparent
}

.c_pointer {
  font-size: 14px !important;
}

.th-sort {
  float: left;
  margin-top: 5px;
}

.import-icon {
  font-size: 65px;
  color: var( --new-primary-color);
}

.import-pra {
  color: #42505C;
  color: #afafaf;
  font-style: italic;
}

.fre-pop {
  cursor: pointer;
  position: absolute;
  right: 14px;
  top: 12px;
  background: transparent !important;
  color: var( --new-primary-color) !important;
  font-size: 14px;
}

.w-350 {
  width: 350px
}

.tooltip-style {
  font-size: 20px;
  background-color: transparent;
}

th p,
thead p,
td p {
  margin-bottom: 0;
}

.p-datatable .p-datatable-tbody>tr>td.no-records {
  text-align: center !important;
}

.pagin-drop {
  border-radius: 3px;
  border: 1px solid #ccc;
  padding: 5px 5px;
  color: #898989;
}

.invalid-feedback {
  border-radius: 3px;
  top: -35px;
  position: absolute;
  z-index: 9;
  background: #dc3545;
  right: 0;
  width: auto !important;
  font-size: 11px !important;
  height: 20px;
  padding: 2px 10px;
  color: #fff !important;
}

.invalid-feedback:after {
  content: '';
  position: absolute;
  left: 8px;
  right: 0;
  width: 0;
  height: 0;
  border-top: 8px solid #dc3545;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  bottom: -8px;
}

.back-to-sigin {
  margin-top: 10px;
  text-align: right;
  color: #212529;

}

.back-to-sigin span {
  color: #0d6efd;
  text-decoration: underline;
  cursor: pointer;
}

.forget-sub-title {
  font-size: 12px;
  font-style: italic;
  color: #828282;
}

p-table {
  /* height: 580px; */
  display: inline-block;
}

.cus-modal-dialog {
  max-width: 750px !important;
}

.cus-modal-dialog1 {
  max-width: 80% !important;
}

.add-job {}

.add-job h1 {
  font-size: 18px;
}

.add-job label {
  width: 100%;
  font-size: 13px;
  margin-bottom: 10px;
}

.add-job select {
  width: 100%;
  margin-bottom: 10px;
}

select:disabled {
  background: #e3e3e3;
}

.icon-position {
  font-size: 12px !important;
  color: #737373 !important;
  position: absolute;
  top: 7px;
  right: 0;
  z-index: 9;
}

.search-box-timer {}

.search-box-timer input {
  border: 0 !important;
}

.search-box-timer button {
  background: transparent !important;
  border: 0;
  color: #737373 !important;
  width: auto !important;
}

.status {
  border-radius: 4px;
  color: #fff;
  font-size: 12px;
  padding: 2px 10px;
}

.progress-content {
  font-size: 12px;
}

.table-action-btn {
  display: flex;
  gap: 5px;
}

.table-action-btn button {
  background: var( --new-primary-color);
  color: #fff;
  padding: 5px 10px;
  border-radius: 4px;
  font-weight: 400;
}

.table-action-btn button {}

.table-action-btn button i {
  font-size: 15px;
  position: relative;
  top: 2px;
}

input[type="radio"] {
  border: 2px solid white;
  box-shadow: 0 0 0 1px var( --new-primary-color);
  appearance: none;
  border-radius: 50%;
  width: 12px;
  height: 12px;
  background-color: #fff;
  transition: all ease-in 0.2s;

}

input[type="radio"]:checked {
  background-color: var( --new-primary-color);
}

.export-label span,
.alignclass {
  font-size: 13px;
  margin-left: 5px;
}



.p-datepicker .p-timepicker span {
  font-size: 13px !important;
}

.p-datepicker .p-timepicker button {
  width: 1rem !important;
  height: 1rem !important;
}

.p-datepicker .p-timepicker {
  padding: 0 !important;
}

.datatable-custom .p-datatable>.p-datatable-wrapper {
  overflow: auto !important;
  height: calc(100vh - 200px);
  border: 1px solid #f0f0f0;
  /* border-bottom: 0; */
}

.summery-table .p-datatable>.p-datatable-wrapper {
  height: auto;
}

.table-responsive {
  border: 1px solid #e4e4e4;
}

.summery-table .p-dropdown {
  height: auto !important;
}

.p-paginator .p-dropdown {
  background: var( --new-primary-color) !important;
  border: 2px solid var( --new-primary-color)6b !important;
  color: #ffffff;
  height: 1.5rem !important;
  border-radius: 3px;
  padding: 0 3px;
  font-weight: 500;
  margin-right: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

.summery-table .p-dropdown .p-dropdown-label {
  margin-top: 0;
  height: auto;
  padding: 0 !important;
}

.scheduleForm .p-multiselect {
  margin: 0;
}

.svp-cus-model-dialog {
  width: auto !important;
  max-width: 65% !important;
  max-height: 70vh;
  height: auto;
}

.tab-with-table .p-datatable>.p-datatable-wrapper {
  height: calc(100vh - 275px);
}

.setting-row .form-check-input:checked {
  background-color: #36c956 !important;
  border-color: #36c956 !important;
}

.setting-row .form-check-label {
  color: #42505C;
  margin-bottom: 30px;
  font-size: 16px;
}

.setting-sec {}

.setting-sec select {
  width: 100%;
  height: 40px;
  padding: 0 5px;
  border-radius: 6px;
  border: 0;
  box-shadow: 2px 2px 8px #00000017;
  font-size: 13px;
}

.setting-box .form-check-label {
  color: #42505C;
  font-size: 13px;
  margin: 0 !important;
}

.p-progressbar {
  height: 15px !important;
  border-radius: 30px !important;
}

.p-progressbar .p-progressbar-label {
  font-size: 10px;
}

.right-dra-heading {
  font-size: 17px;
}

.right-dra-heading span {
  font-size: 15px;
  color: #939393;
  /* font-style: italic; */
}

.tableHeaderClass {
  cursor: pointer;
}

.pop-close {
  background: #ccc;
  border-radius: 100%;
  width: 25px;
  height: 25px;
  align-items: center;
  display: flex;
  justify-content: center;
  cursor: pointer;
  position: absolute;
  right: -12px;
  top: -12px;
}

.pop-close i {
  color: #000;
}

.import-tab-content {
  padding: 10px;
  border: 1px solid #e7e7e7;
}

.p-datatable .p-sortable-column .p-sortable-column-icon {
  margin-left: 4px !important;
  width: 14px;
  height: 11px;
}

.p-tooltip>.p-tooltip-text {
  /* width: max-content !important;
  position: absolute;
  right: -10px; */

}

p-tooltip-arrow {
  display: none;
}

.cus-pop-close {
  /* position: absolute;
    top: -10px;
    right: -10px;
    z-index: 999; */
}

.input-eye {
  position: absolute;
  right: 0;
  z-index: 9;
  top: 14px;
  right: 10px;
}

.input-eye i {
  color: #2f3135;
}

.sett-multi .p-multiselect {
  margin: 0 !important;
}

.cus-check-box-mt .form-check-input {
  margin-top: 5px;
}

.p-scroller::-webkit-scrollbar,
.p-dialog-content::-webkit-scrollbar {
  width: 5px;
  height: 4px;
}

.p-scroller::-webkit-scrollbar-track,
.p-dialog-content::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.p-scroller::-webkit-scrollbar-thumb,
.p-dialog-content::-webkit-scrollbar-thumb {
  background: #369;
}

.p-scroller::-webkit-scrollbar-thumb:hover,
.p-dialog-content::-webkit-scrollbar-thumb:hover {
  background: #555;
}


::-webkit-scrollbar {
  width: 5px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: #369;
}

::-webkit-scrollbar-thumb:hover {
  background: #555;
}

.p-dialog .p-dialog-content {
  padding-bottom: 60px !important;
}

.Rightside-popup .p-multiselect-clear-icon {
  margin-top: 10px !important;
  height: 30% !important;
  background: transparent !important;
}

.error-content {
  font-size: 11px;
  color: #ff0000;
}

.view-chart {
  padding: 2px 10px !important;
  border-radius: 6px !important;
  margin-left: 10px;
}

.search-box-timer button.p-button.p-button-icon-only {
  padding-right: 5px !important;
}



.bi::before {
  transition: transform 0.3s ease-in-out;
}

.rotate-icon::before {
  transform: rotate(180deg);
  transition: transform 0.3s ease-in-out;
}


.job-history .p-datatable>.p-datatable-wrapper {
  overflow: inherit !important;
  height: calc(100vh - 168px) !important;
}

.active-main-row {
  background: #d4e3ff !important;
}

.active-main-row th {
  background: transparent;
}

.accordion-button:not(.collapsed) {
  background: #d4e3ff !important;
}

.fixed-pagination .p-datatable .p-paginator-bottom {
  position: fixed;
  right: 10px;
  padding: 10px 10px;
}

.datatable-custom .p-datatable .p-paginator {
  border: 0 !important;
}

.datatable-custom .p-paginator .p-dropdown .p-dropdown-label {
  /* color: #495059 !important; */
}

.datatable-custom .p-dropdown .p-dropdown-trigger {
  color: #495059 !important;
  margin-top: 4px;
}

.datatable-custom .p-dropdown .p-dropdown-trigger .p-icon {
  width: 12px !important;
  height: 12px !important;
}

.carousel-item img {
  margin: 0 auto;
  height: 300px;
  width: auto;
  max-width: 50% !important;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: invert(100%);
  -webkit-filter: invert(100%);
}

.p-dropdown-trigger .p-icon-wrapper {
  width: 11px;
  color: #535353;
}

body .p-multiselect .p-multiselect-trigger,
body .p-dropdown .p-dropdown-trigger {
  margin-top: 3px !important;
  width: .8rem !important;
}

.p-paginator .p-paginator-current {
  display: none;
}

.p-paginator .p-paginator-first,
.p-paginator .p-paginator-prev,
.p-paginator .p-paginator-next,
.p-paginator .p-paginator-last {
  margin: 0 3.5px !important;
  min-width: 1rem !important;
  height: 1rem !important;
}

.p-paginator-pages {
  display: flex;
  gap: 10px;
}

.cus-time-width {
  width: 120px;
  display: block;
}

#nav-advanced ul.audit-tab-list li span,
#nav-standards ul.audit-tab-list li span {
  width: calc(100% - 0px);
}

#nav-advanced ul.audit-tab-list li span.right-circle,
#nav-standards ul.audit-tab-list li span.right-circle {
  display: none;
}

#nav-advanced .audit-right,
#nav-standards .audit-right {
  display: none;
}

.dashboard-tab {
  justify-content: start;
  flex-direction: row !important;
  border-bottom: 0px solid #cacaca !important;
  gap: 20px;
}

.dashboard-tab .nav-link {
  padding: 0px 5px 11px 5px;
  font-size: 14px;
  background: transparent;
  color: #42505C;
  font-weight: 500;
}

.dashboard-tab .nav-link:hover {}

.dashboard-tab .nav-link.active {}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus {}

.p-multiselect-trigger-icon {
  margin-right: -10px !important;
  width: 10px !important;
  color: #000 !important;
}

.export-label {
  /* background: #dadada; */
  padding: 5px 10px;
  margin-right: 10px;
}

.export-tab-cont label {
  font-size: 13px;
  font-weight: 500;
}

.count-ellipse {
  display: flex !important;
}


.p-dialog {
  max-height: 100% !important;
  margin: 0 !important;
}

.p-overlay {
  right: 0;
}

.p-datepicker table td>span {
  color: rgba(0, 0, 0, .85) !important;
}

.table-popover {
  position: absolute;
  bottom: 6px;
  left: calc(100% + 15px);
  display: none;
  z-index: 9999;
}

.table-popover .popover-box {
  background: #454545;
  padding: 10px;
  border-radius: 6px;
  position: relative;
}

.table-popover .popover-box::before {
  content: "";
  width: 0;
  height: 0;
  border-left: 20px solid transparent;
  border-right: 0px solid transparent;
  border-bottom: 15px solid #454545;
  position: absolute;
  bottom: 0px;
  left: -10px;
}

.table-popover .popover-box table {
  background: transparent !important;
}

.table-popover .popover-box h1 {
  color: #fff;
  font-size: 13px;
  font-weight: 400;
  padding: 0 5px;
  margin-bottom: 10px;
  margin-top: 5px;
}

.table-popover .popover-box table thead {}

.table-popover .popover-box table thead tr {
  background: transparent !important;
}

.table-popover .popover-box table tr th {
  background: transparent;
  font-weight: 400;
  color: #fff;
  padding: 5px 5px;
  text-align: left;
}

.table-popover .popover-box table tbody {}

.table-popover .popover-box table tbody tr {
  background: transparent !important;
}

.table-popover .popover-box table tbody tr td {
  color: #fff;
  padding: 5px 5px;
  font-size: 13px !important;
  text-align: center;
}

.table-popover .popover-box table tbody tr td.value-position {
  display: flex;
  align-items: center;
  gap: 10px;
}

.table-popover .popover-box table tbody tr td.value-position span {
  width: 10px;
  height: 10px;
  border-radius: 100%;
}

.tooltip-td {}

.tooltip-td:hover .table-popover {
  display: block;
}

.p-datatable .p-datatable-tbody>tr:nth-child(-n+3) .table-popover {
  bottom: auto;
  top: 9px;
}

.p-datatable .p-datatable-tbody>tr:nth-child(-n+3) .table-popover .popover-box::before {

  bottom: auto;

  top: 0px;

  border-bottom: 0;

  border-top: 15px solid #454545;
}

.p-datatable .p-datatable-tbody>tr>td.total {
  background: #eaeaff;
}

.p-datatable .p-datatable-tbody>tr>td.first-page {
  background: #e1ffe9;
}


.p-icon-wrapper .p-icon {
  width: 10px !important;
}

.highlight-filter .p-column-filter-menu-button {
  background: var( --new-primary-color) !important;
  width: 25px;
  height: 25px;
}

.highlight-filter .p-column-filter-menu-button .p-icon-wrapper svg.p-icon {
  color: rgb(255, 255, 255);
}

.filter-highlight-align {
  display: flex;
  align-items: center;
  gap: 5px;
}

.filter-highlight-align .p-element .p-column-filter .p-column-filter-menu-button {
  width: 25px;
  height: 25px;
}

.new-td-pro {
  height: 2rem !important;
  margin-left: 0;
}

.form-switch .form-check-input {
  width: 35px !important;
  height: 20px;
  border-color: #ccc;
}

.form-check-input:checked {
  background-color: var( --new-primary-color) !important;
  border-color: var( --new-primary-color) !important;
}

.action-mail {
  display: flex !important;
  gap: 10px;
  align-items: center;
}

.action-mail a {
  color: var( --new-primary-color);
  font-size: 17px;
}

.action-mail a.mail-btn {
  background: var( --new-primary-color);
  color: #fff;
  padding: 5px;
  font-size: 11px;
  border-radius: 4px;
}

.email-form {}

.email-form .form-label {
  margin-bottom: 0;
  font-weight: 500;
}

.email-form .form-control {
  padding: 0 10px;
}

.email-form textarea.form-control {
  padding: 10px;
  height: 250px;
}

.email-form h1 {

  font-size: 12px;

  padding: 13px;

  background: #f5f3ff;

  border-radius: 6px;

  text-transform: inherit;

  border: 1px solid #ccc;
}

.mail-content-box {

  background: #f5f3ff;

  border: 1px solid #ccc;

  padding: 13px;

  border-radius: 6px;
}

.mail-content-box p {
  font-size: 12px;
  text-transform: inherit;
}

.mail-content-box table {
  width: 100%;
  background: transparent;
}

.mail-content-box table thead {}

.mail-content-box table thead tr td {
  font-size: 12px !important;
  padding: 5px;
  font-weight: 500;
}

.mail-content-box table tbody {}

.mail-content-box table tbody tr td {
  font-size: 12px !important;
  padding: 5px;
}

.mail-content-box table tr {
  background: transparent;
}

.mail-msg-list {
  margin: 10px 0;
  border-bottom: 1px solid #ccc;
}

.mail-msg-list h1 {
  font-size: 14px;
  color: #272727;
}

.mail-msg-list span {
  font-size: 11px;
  color: #afafaf;
}

.mail-msg-list p {
  color: #9f9f9f;
  font-weight: 400;
  font-size: 13px;
  margin-top: 10px;
}

.rule-add-box {
  display: inline-flex;
  flex-direction: column;
  padding: 20px 30px;
  gap: 10px;
  border: 2px solid var( --new-primary-color);
  width: 400px;
}

.rule-add-box span {
  margin-bottom: 5px;
}

.rule-add-box span i {
  font-size: 15px;
  color: var( --new-primary-color);
}

.rule-add-box h1 {

  font-size: 16px;

  margin: 0;
}

.rule-add-box p {
  margin: 0;
  font-size: 13px;
}

.rule-add-box a {
  background: var( --new-primary-color);
  text-align: center;
  color: #fff !important;
  padding: 8px;
  font-size: 13px;
  margin-top: 35px;
}

ul.set-rule {
  display: flex;
  gap: 40px;
}

ul.set-rule li {}

ul.set-rule li {}

ul.set-rule li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 14px;
  font-weight: 500;
}

ul.set-rule li a i {
  font-size: 30px;
}

.rule-box {
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 10px;
}

.rule-form-label {
  display: block;
  text-align: right;
  font-size: 13px;
  font-weight: 500;
}

.rule-form-input,
.rule-form-select {
  border: 1px solid #ccc;
  border-radius: 3px;
  height: 40px;
  width: 100%;
  font-size: 12px;
  padding: 10px;
}

.p-datatable .p-datatable-tbody>tr>td .rule-form-select {
  width: auto !important;
  max-width: 100%;
  height: 30px;
  padding: 0 5px;
}

.table-action-btn {
  display: flex;
  gap: 10px;
  align-items: center;
}

.table-action-btn i {
  font-size: 17px;
}

.table-action-btn i.edit {
  color: var( --new-primary-color);
}

.table-action-btn i.delete {
  color: #fd3131;
}

.offcanvas-header {}

.offcanvas-header h5 {
  font-size: 0.85rem;
  color: #2a2a2a;
  margin-bottom: 0;
  font-weight: 500;
}

.p-tabview .p-tabview-nav {
  background: #ffffff;
  border: 1px solid #dee2e6;
  border-width: 0 0 2px 0;
  display: flex;
  gap: 10px;
  width: 100%;
}

.p-tabview .p-tabview-nav li {
  margin-right: 0
}

.p-tabview .p-tabview-nav li button {

  font-size: 13px;

  color: #6c757d;

  font-weight: 600;

  padding: .5rem 1rem;
}

.p-tabview .p-tabview-nav li button.active {
  border-bottom: 3px solid var( --new-primary-color);
  position: relative !important;
  bottom: -1px;
  color: var( --new-primary-color);
}

.table-left-sticky {
  position: sticky;
  left: 0;
}

.cus-popup {
  position: fixed;
  background: #fff;
  left: 0;
  right: 0;
  z-index: 9999;
  width: 70%;
  margin: 0 auto;
  height: 90vh;
  top: 5vh;
  border-radius: 10px;
  overflow: hidden;
}

.pop-head {
  background: #F7F9FC;
  /* margin: 0 -20px; */
  height: 40px;
  position: sticky;
  top: 0;
  z-index: 999;
  box-shadow: 2px 2px 2px #0000000d;
}

.pop-head h1 {

  font-size: 17px;

  padding: 10px 15px;
}

.pop-cont {
  padding: 20px;
  height: 94%;
  overflow: auto;
}

.content-audit-product {

display: flex;

align-items: center;

gap: 10px;

padding-bottom: 10px;

/* border-bottom: 1px solid #e7e7e7; */

justify-content: space-between;
}

.content-audit-product .prot-img {
  height: 125px;
  width: auto;
}

.content-audit-product .prot-img img {
  border: 1px solid #dfdfdf;
  padding: 5px;
  width: auto;
  height: 100%;
}

.content-audit-product .range {
  width: 175px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 7px;
}

.content-audit-product .range img {
  width: 100px;
}

.content-audit-product .range h1 {
  font-size: 12px;
}


.content-audit-product .content-status button {
  font-size: 11px;
  padding: 5px 10px;
  /* width: 200px; */
  text-align: center;
  color: #fff;
  border-radius: 5px;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.content-audit-product .content-status h1 {

font-size: 14px;

margin-bottom: 15px;

color: #999999;

font-weight: 500;

line-height: 22px;
}

.content-audit-product .content-status button.rec {
  background: #FF9040;
}

.content-audit-product .content-status button.rec label {
  border-radius: 100%;
  background: #fff;
  color: #FF9040;
  width: 15px;
  height: 15px;
  font-size: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.content-audit-product .content-status button.imp {
  background: var( --new-primary-color);
}

.rating-count {
  display: flex;
  align-items: center;
  gap: 11px;
}

.rating-count h6 {
  font-size: 18px;
  color: var( --new-primary-color);
  background: #dadada;
  border-radius: 100%;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rating-count h6 span {
  position: relative;
  font-size: 10px;
  color: #929292;
  top: 2px;
}

.nav_list {
  position: relative;
}

.nav_list::before {
  position: absolute;
  content: '';
  background: url(../img/nav-shape.png);
  display: inline-block;
  width: calc(var(--nav-width) - 162px);
  height: calc(var(--nav-width) - 155px);
  background-repeat: no-repeat;
  background-size: cover;
  top: -83px;
  display: none;
}

.nav_list::after {
  position: absolute;
  content: '';
  background: url(../img/nav-shape.png);
  display: inline-block;
  width: calc(var(--nav-width) - 162px);
  height: calc(var(--nav-width) - 155px);
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-transform: scaleY(-1);
  transform: scaleY(-1);
  display: none;
}

.logout-icon {}

.logout-icon i {
  color: #ffffffcf;
}


.content-new-tab .nav {
  justify-content: start;
  flex-direction: row !important;
  margin: 0px 0;
  padding: 10px 5px;
  border: 1px solid #ccc;
  overflow: auto;
  display: flex;
  flex-wrap: nowrap;
}

.content-new-tab .nav::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

.content-new-tab .nav::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.content-new-tab .nav::-webkit-scrollbar-thumb {
  background: #d0d0d0;
}

.content-new-tab .nav::-webkit-scrollbar-thumb:hover {
  background: #555;
}

.content-new-tab .nav .nav-item.show .nav-link,
.content-new-tab .nav .nav-link.active {
  background: var( --new-primary-color) !important;
  /* border-radius: 6px; */
  color: #ffffff !important;
}

.content-new-tab .nav .nav-link {
  color: #425065;
  font-weight: 500;
  border-radius: 10px 10px 0 0;
  background: #fcfcfc;
  font-size: 14px;
  padding: 10px 15px;
  border: 1px solid #e2e2e2 !important;
  border-radius: 0;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 5px;
  /* border-top: 0 !important; */
  /* border-bottom: 0 !important; */
  margin: 0 5px;
  align-items: start;
  text-align: left;
  /* width: 210px; */
  flex: none;
  /* border-radius: 6px; */
}

.content-new-tab .nav .nav-link:hover {
  background: var( --new-primary-color) !important;
  color: #ffffff !important;
}

.content-new-tab .tab-content {

margin-top: 15px;

border: 1px solid #ccc;

padding: 20px;
}

.content-new-tab .nav .nav-link span {
  color: #ff9040;
  display: flex;
  font-size: 13px;
}

.content-new-tab .nav .nav-link:hover span,
.content-new-tab .nav .nav-item.show .nav-link span,
.content-new-tab .nav .nav-link.active span {
  color: #fff !important;
}

.content-new-tab .progress {
  width: 100%;
  height: 5px !important;
  min-width: 100px;
}

.content-new-tab .progress .progress-bar {
  background: #b7b7b7;
}

.user-name-trun {}

.user-name-trun .nav_link-box {}

.user-name-trun .nav_link-box i {
  color: var( --new-primary-color);
}

.profile-dropdown {
  display: flex;
  justify-content: end;
}

.profile-dropdown span {
  color: var( --new-primary-color);
  border-radius: 100%;
  position: relative;
  font-size: 25px;
}

.profile-dropdown .profile-dropdown-menu {
  display: none;
  position: absolute;
  width: 150px;
  right: 0;
  top: 0;
  padding-top: 40px;
  z-index: 999;
}

.profile-dropdown-menu h1 {
  text-align: center;
  font-size: 15px !important;
  border-bottom: 1px solid #ccc;
  padding: 0 10px 15px 10px;
  color: var( --new-primary-color) !important;
  word-wrap: break-word;
}

.drop-menu h1 {

  font-size: 13px;
}

.profile-dropdown span.drop-menu:hover .profile-dropdown-menu {
  display: block;
}

.profile-dropdown .profile-dropdown-menu ul {
  margin: 0;
  padding: 0;
  list-style: none;
  background: #f8fbff;
  box-shadow: 2px 2px 5px #00000029;
  padding-top: 20px;
}

.profile-dropdown .profile-dropdown-menu ul li {}

.profile-dropdown .profile-dropdown-menu ul li a {
  font-size: 13px;
  text-decoration: #000;
  text-decoration: none;
  padding: 10px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #7b7b7b;
  border-bottom: 1px solid #dadada;
}

.profile-dropdown .profile-dropdown-menu ul li a i {
  color: var(--secondary-color);
  font-size: 17px;
}

.profile-dropdown .profile-dropdown-menu ul li a:hover {
  background: var(--secondary-color);
  color: var( --new-primary-color);
}

.profile-dropdown .profile-dropdown-menu ul li a:hover i {
  color: var( --new-primary-color);
}

.profile-dropdown .profile-dropdown-menu::after {
  content: '';
  position: absolute;
  right: 10px;
  top: 30px;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #ffffffb8;
  clear: both;
}

body .p-dropdown .p-dropdown-label {
  margin-top: 0 !important;
  color: #646464;
}

.table-header {
  margin-top: 1rem;
}

.datatable-custom {
  margin-bottom: 0 !important;
}

.datatable-custom .p-datatable .p-datatable-header {
  margin-bottom: 1rem;
  padding: 0 !important;
}

.datatable-custom .p-datatable .p-datatable-thead>tr>th {
  padding: .5rem 1rem !important;
}

.datatable-custom .p-paginator .p-dropdown .p-dropdown-trigger .p-icon-wrapper {
  color: #fff;
}

.settingss-info {
  position: absolute;
  left: 100px !important;
  top: 13px !important;
  z-index: 9;
}



.alert-div {
  display: flex;
  flex-wrap: wrap;
}

.alert-box {
  padding: 10px;
  background: #f3f3f3;
  border-radius: 6px;
  width: calc(50% - 8px);
  gap: 15px;
  display: flex;
  justify-content: space-between;
}

.alert-box div {
  align-items: self-start;
  flex-direction: column;
  display: flex;
  gap: 10px;
  /* justify-content: space-between; */
}

.alert-box div span {
  display: flex;
  background: var( --new-primary-color);
  font-size: 11px;
  color: #fff;
  border-radius: 6px;
  padding: 3px 10px 1px 10px;
  align-items: center;
  justify-content: center;
}

.alert-box div p {
  margin: 0;
  color: #bababa;
  font-size: 13px;
}

.alert-box div h6 {
  font-weight: 400;
  font-size: 13px;
  color: #8d8d8d;
}

.alert-box div input {
  border-radius: 100% !important;
  width: 25px;
  height: 25px;
}

.alert-box label {
  color: var( --new-primary-color);
  font-weight: 600;
}

.alert-div-int {

  width: auto;

  align-items: center !important;
}

.product-value-box {
  display: flex;
  gap: 10px;
  width: 100%;
}

.product-values {
  border: 1px solid #d4d4ff;
  background: #f7f7ff;
  padding: 10px;
  border-radius: 6px;
  width: 25%;
  position: relative;
  padding-top: 20px;
}

.product-values h2 {
  font-size: 11px;
  color: #3b3b3b;
  font-weight: 400;
}

.product-values span {
  font-weight: 500;
  font-size: 13px;
}

.product-values a {
  position: absolute;
  right: 3px;
  top: 1px;
  font-size: 12px;
  color: #a2a2a2;
}

.pop-filter-box {
  position: relative;
  display: none;
}

.pop-filter {
  position: absolute;
  background: #fff;
  box-shadow: 1px 2px 3px #ccc;
  padding: 15px;
  z-index: 99;
  min-width: 100%;
  right: 0;
  border-radius: 6px;
  border: 1px solid #e2e2e2;
}

.pop-filter .top-input {
  display: flex;
  align-items: center;
  gap: 20px;
}

.pop-filter .top-input h1 {
  width: auto;
  font-size: 13px;
  text-align: center;
  color: #838383;
  white-space: nowrap;
}

.map-vilo-box {
  display: flex;
  align-items: center;
  gap: 15px;
}

.map-vilo-box .product-value-box {
  flex-direction: column;
  width: 20%;
}

.map-vilo-box .product-values {
  width: 100%;
}

.p-paginator .p-dropdown .p-dropdown-label {
  color: #fff;
}

.p-paginator .p-dropdown .p-dropdown-trigger .p-icon-wrapper {
  color: #fff;
}


.report-title-box {
  margin-bottom: 20px;
}

.report-title-box h1 {
  font-size: 15px;
  color: var( --new-primary-color);
  margin-bottom: 10px;
}

.report-title-box h3 {
  font-size: 13px;
  font-weight: 400;
  color: #868686;
  line-height: 22px;
}

.report-title-box p {
  line-height: normal;
  margin: 0;
  /* background: #fcf9f9; */
  /* display: flex; */
  align-items: center;
  font-size: 13px;
  width: 100%;
  /* padding: 15px; */
  /* border: 1px solid #fff2f2; */
  border-radius: 8px;
  color: #727272;
}

.report-title-box textarea {
  height: 70px;
    width: 100%;
    font-size: 14px;
    color: #727272;
    padding: 5px;
    background: #fbfbfb;
    padding: 10px 25px 10px 15px;
    border: 1px solid #eeeeee;
    border-radius: 4px;
}

.report-title-box button {
  font-size: 12px;
  padding: 5px;
  text-align: center;
  color: #fff;
  border-radius: 5px;
  font-weight: 500;
  width: 150px;
  background: var( --new-primary-color);
}

.rules-box {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.rules-box p {
  background: none;
  border: 0;
  padding: 0;
  color: #737373;
  font-weight: 400;
}



.cus-pop-cls {
  margin-right: 15px;
}

.rel-count {
  font-size: 10px;
  color: #a5a5a5;
}

.rel-key {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
  margin-top: 5px;
}

.rel-key button {
  background: #f2f2f3;
  border-radius: 3px;
  width: auto;
  padding: 1px 5px;
  color: #656565;
  font-weight: 400;
}

.rel-key button:disabled {
  cursor: initial;
  opacity: 1;
}

.rel-key button.active-key {
  background: #bafbc1;
}

.title-score {

text-align: center;

font-size: 13px !important;

background: #e7e6ff; 

/* display: flex; */

align-items: center;

font-size: 13px;

width: 100%;

padding: 15px;

border: 1px solid #d6d6d6;

border-radius: 8px;

color: #242424;
}

.content-new-tab .nav .nav-item.show .nav-link,
.content-new-tab .nav .nav-link.active .progress .progress-bar {
  background: #fff !important;
}

.content-new-tab .nav .nav-item.show .nav-link,
.content-new-tab .nav .nav-link.active .progress {
  background: #ffffffa1 !important
}

.content-new-tab .nav .nav-link:hover .progress .progress-bar {
  background: #fff !important;
}

.content-new-tab .nav .nav-link:hover .progress {
  background: #ffffffa1 !important;
}

.title-score span {
  /* font-size: 20px; */
  /* font-family: cursive; */
  /* color: var( --new-primary-color); */
  /* animation: blink 1s linear infinite; */
}

@keyframes blink {
  0% {
    opacity: 0;
  }

  50% {
    opacity: .5;
  }

  100% {
    opacity: 1;
  }
}

.cont-au-edit {
  position: absolute;
    right: 19px;
    font-size: 12px;
    top: 15px;
}

.report-title-box table{
    /* border: 1px solid #000; */
}
.report-title-box table thead{}
.report-title-box table thead th{
    font-size: 14px !important;
    padding: 10px;
    border: 1px solid #d2d2d2;
    background: #e7e6ff;
}
.report-title-box table tbody{}
.report-title-box table tbody td{
    color: #727272;
    font-size: 14px !important;
    padding: 10px;
    border: 1px solid #f2f2f2;
}
.report-title-box table tbody td span {
  padding: 3px 20px;
  display: inline-block;
  font-size: 13px;
  border-radius: 3px;
  display: inline-flex;
  align-items: center;
  width: 80px;
  justify-content: center;
}

.report-title-box table tbody td span.pass {
  background: #BAFBC1;
  color: #073C0D;
}

.report-title-box table tbody td span.fail {
  background: #FBD9BA;
  color: #FF2424;
}

.chart-button{
  
position: absolute;
  
top: -15px;
  
right: 15px;
  
background: linear-gradient(45deg, var( --new-primary-color), #9a96ff);
  
color: #fff;
  
width: 45px;
  
height: 45px;
  
display: flex;
  
justify-content: center;
  
align-items: center;
  
border-radius: 100%;
  
box-shadow: 2px 2px 6px var( --new-primary-color);
  
font-size: 22px;
}



.chat-box .chat-heading{
    background: var( --new-primary-color);
    border-radius: 14px 14px 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 15px;
    height: 65px;
}
.chat-box .chat-heading h1{margin: 0;color: #fff;font-size: 20px;display: flex;gap: 15px;align-items: center;}
.chat-box .chat-heading span{}
.chat-box .chat-heading span i{
    font-size: 20px;
    color: #fff;
}
.chat-box .chat-heading span img{
  width: 40px;
}
.chat-box .chat-body{
    display: flex;
    gap: 0px;
    height: calc(100vh - 165px);
    overflow: auto;
    background: #fff;
}
.chat-box .chat-body .chat-left{
    width: 300px;
    background: #e8e8ff;
    padding: 20px 12px;
    height: calc(100vh - 165px);
    overflow: auto;
}
.chat-box .chat-body .chat-left .prev-ques{
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.chat-box .chat-body .chat-left .prev-ques h1{
    font-size: 15px;
}

.chat-box .chat-body .chat-left .prev-ques p{
  font-size: 13px;
  display: -webkit-box;
  -webkit-line-clamp: 1;      /* Number of lines to show */
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
}
.chat-box .chat-body .chat-right{
    display: flex;
    flex-direction: column;
    gap: 15px;
    width: 100%;
    padding: 20px;
    height: calc(100vh - 165px);
    overflow: auto;
}
body.cus-backdrop::after{
  background: rgb(51 51 51 / 60%);
  content: ".";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
}
.chat-1{
    font-size: 12px;
    font-weight: 300;
    background: #f6f6f6;
    padding: 7px 15px;
    border-radius: 7px;
    display: inline-flex;
    float: right;
    border: 1px solid #dcdcdc;
    margin-left: 75px;
}
.chat-2{
  font-size: 12px;
  font-weight: 300;
  background: #ffffff;
  padding: 7px 15px;
  border-radius: 7px;
  display: inline-flex;
  float: left;
  border: 1px solid #dcdcdc;
  margin-right: 75px;
  }
.chat-3{
    font-size: 12px;
    color: var( --new-primary-color);
    margin: 0px 75px;
    font-weight: 500;
    padding: 7px 15px;
    border-radius: 7px;
    display: inline-flex;
    border: 2px solid var( --new-primary-color);
}
.chat-input{
    background: #fff;
    position: relative;
}
.chat-input textarea{
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 7px;
    background: #e8e8ff;
    height: 70px;
    padding: 10px;
    box-sizing: border-box;
    font-size: 12px;
    padding-right: 40px;
}
.chat-input button{
    position: absolute;
    right: 7px;
    background: var( --new-primary-color);
    border-radius: 100%;
    width: 30px;
    height: 30px;
    top: calc(50% - 15px);
    display: flex;
    align-items: center;
    justify-content: center;
}
.chat-input button i{
    color: #fff;
    font-size: 13px;
}


/*chat-backdrop*/


.review-head{
  font-size: 13px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}
.rat-drawer-img{
  max-width: 100px;
    width: auto;
    max-height: 100px;
}

.scr-imp{
  font-size: 17px;
    text-align: center;
    margin: 30px 0;
    padding-bottom: 5px;
}
.edit-bx-bg{
  padding: 10px;
  BORDER: 1px solid #ccc;
  border-radius: 6px;
}
.foot-bor{

display: flex;

/* gap: 10px; */

justify-content: end;

/* padding: 5px 10px; */

background: #ffffff;

padding-top: 5px;
}
.foot-bor button{
    /* background: none !important; */
    border: 0 !important;
    padding: 5px 0 !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    width: 50%;
    border-radius: 0 !important;
}
.foot-apply{
  color: #ffffff !important;
  background: var( --new-primary-color) !important;
}
.foot-cancel{
  color: #000 !important;
  background: #e4e3ff !important;
}

.carousel-control-prev, .carousel-control-next{
  background: none !important;
  width: auto ! IMPORTANT;
}

.carousel-control-prev-icon, .carousel-control-next-icon {
  display: inline-block;
  width: 1.5rem !important;
  height: 2rem;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 100% 100%;
  background-color: var( --new-primary-color);
  filter: none;
  padding: 10px;

}
.drawer-prod-img{
    height: 125px;
    width: auto;
}

.drawer-prod-img img{
    width: auto;
    height: 100%;
}
.loader-box-cus{
  position: relative;
  width: 100%;
}
.loader {
  border: 8px solid #cccbff;
  border-radius: 50%;
  border-top: 8px solid var( --new-primary-color);
  border-bottom: 8px solid var( --new-primary-color);
  width: 75px;
  height: 75px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
  position: absolute;
  margin: auto;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.cus-pad-0{padding: 0 !important;}

.cus-req{
  
position: absolute;
  
bottom: -21px;
}

.mlt-sel-mar .p-multiselect{margin: 0 !important;border-radius: 0;border: 0;border-bottom: 1px solid #afafaf;padding: 0 5px 0 2px;}


/* Tooltip container */
.tooltip {

  font-size: 20px;         
  max-width: 200px;        
  padding: 5px;        
  border-radius: 8px;  
  background: #fff;
  opacity: 1;   
  box-shadow: 1px 1px 2px #000; 
  
}


::ng-deep .tooltip .tooltip-inner {
  background-color: #333 !important;
  color: #fff !important;
}
.das-sel{
  border:0 !important; border-bottom:1px solid rgb(175, 175, 175) !important; border-radius:0 !important; width: auto;
}

.opti-to-head{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.opti-to-head h1{
    font-size: 13px;
}
.opti-to-head button{
    font-size: 12px;
    border: 1px solid #3d3d3d;
    padding: 3px 8px;
    border-radius: 6px;
}

.opti-cont-box{
    margin-top: 15px;
    height: 93%;
    border: 1px solid #efefef;
    border-radius: 8px;
    padding: 0 15px;
}
.opti-cont-box .opti-to-head{
    padding: 10px 15px;
    background: #efecec;
    border-radius: 7px 7px 0 0;
    margin: 0 -15px;
}
.opti-cont-box .opti-to-head button{
    background: var( --new-primary-color);
    color: #fff;
    border: 1px solid var( --new-primary-color);
    padding: 5px 15px;
    display: flex;
    gap: 7px;
    align-items: center;
    justify-content: center;
}
.opti-cont-box .opti-to-head button img, .opti-contet-product .opti-pro-head .button-box button img{
  
height: 17px;
  
width: auto;
}
.opti-contet-product-box{height: 90%;overflow: auto;}
.opti-contet-product{
    margin-top: 15px;
}
.opti-contet-product .opti-pro-head{
    display: flex;
    background: #f4f4f4;
    border-radius: 7px;
    align-items: center;
    padding: 10px 15px;
}
.opti-contet-product .opti-pro-head h1{
    font-size: 13px;
    width: 70%;
}
.button-box{
    display: flex;
    width: 30%;
    gap: 10px;
    white-space: nowrap;
    justify-content: end;
}
.button-box button{
    font-size: 12px;
    padding: 5px 15px;
}
.button-box button.btn-1{
    color: #000;
    padding: 0;
}
.button-box button.btn-2{
    background: #fff;
    border: 1px solid #d1d1d1;
    border-radius: 6px;
}
.button-box button.btn-3{
    background: #515151;
    border-radius: 6px;
    color: #fff;
}

.opti-pro-cont{
    padding: 15px;
    padding-bottom: 0;
}
.opti-pro-cont h2{
    font-size: 13px;
    color: #a1a1a1;
    margin-bottom: 10px;
}
.opti-pro-cont p{
    margin: 0;
    font-size: 13px;
    color: #5b5b5b;
}
.opti-pro-cont p span{
    font-weight: 600;
    color: #000;
}
.exi-box{
    background: #00000003;
    border-radius: 7px;
    padding: 10px;
    border: 1px solid #c5c5c5;
}
.opt-box{
    background: #00000014;
    border-radius: 7px;
    padding: 10px;
    border: 1px solid #c5c5c5;
}
.optimize-content-edit{
  background: #f1f1f1;
  padding: 15px;
  border-radius: 7px;
  margin-bottom: 15px;
  margin-top: 15px;
}
.optimize-content-edit h1{
    font-size: 14px;
}
.optimize-content-edit p{
  font-size: 13px;
  margin-top: 20px;
  background: #fff;
  border-radius: 7px;
  padding: 15px 20px;
}
.optimize-content-edit .select-boxes{
    margin-top: 15px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.optimize-content-edit .select-boxes select{
    width: 170px;
    border: 0;
    background: #fff;
    border-radius: 30px;
    height: 30px;
    padding: 0 5px;
    font-size: 13px;
}
.optimize-content-edit .select-boxes button{
    background: var( --new-primary-color);
    color: #fff;
    width: 170px;
    height: 30px;
    border-radius: 30px;
    font-size: 13px;
}
.cus-rat-up-clr{
  margin: 0 !important;
  font-size: 13px !important;
  color: var( --new-primary-color) !important;
  font-weight: 500;
}
.pop-sel-cus{
    gap: 20px;
}
.pop-sel-cus select{
    height: 37px;
    line-height: 37px;
    width: 100%;
    border-radius: 6px;
    font-size: 13px;
    border: 1px solid #ccc;
}

.l-navbar {
  position: fixed;
  top: 0;
  left: -30%;
  width: 310px;
  height: 100vh;
  background-color: var( --new-primary-nav-bar-color);
  transition: .5s;
  z-index: 99;
  /* border-right: 1px solid #efefef; */
  overflow: hidden;
}

.nav {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* overflow: hidden; */
}

.nav_logo,
.nav_link {
  display: flex;
  align-items: center;
  column-gap: 1rem;
}

.menu-show .nav_link {
  width: 76px;
}

.nav_logo {
  /* margin-bottom: 2rem; */
  background: var( --new-primary-nav-bar-color);
  padding: 19.5px 10px;
  border-bottom: 1px solid #ffffff80;
  border-top: 0;
  height: 75px;
}

.new-menu{
  height: calc(100vh - 95px);
  overflow: auto;
  margin: 10px 10px;
}

.nav_logo .nav_link-box {
  padding: 0;
}

.nav_logo img {
  width: 100%;
  left: 0;
  position: relative;
  border-radius: 4px;
}

.nav_logo span {
  color: #fff;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 25px;
}


.header {
  width: 100%;
  position: relative;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: start;
  padding: 11px 30px !important;
  background-color: #ffffff;
  transition: .5s;
  border-bottom: 1px solid #E6E6E6;
  /* border-left: 1px solid #efefef; */
  display: flex;
  justify-content: space-between;
  /* box-shadow: 0px 3px 7px #0000003b; */
  z-index: 999;
  height: 75px;
}

.menu-item, .submenu-item {
  padding: 15px 0px;
  cursor: pointer;
  user-select: none;
  display: flex;
  gap:10px;
  align-items: center;
  color: #fff;
  font-size: 13px;
}
.sub-menu-indicator{
  color: #858585 !important;
}
.menu-show .sub-menu-indicator{
  display: none;
}
.menu-item svg, .submenu-item svg{color: #ffffff;width: 18px;}
.menu-item svg.arrow, .submenu-item.arrow svg{
  width: 16px;
}
.menu-item span, .submenu-item span{
  flex-grow: 1;
  white-space: nowrap;
  width: 0;
  overflow: hidden;
  display: inline-block;
  transition: 0.3s;
}
.submenu, .sub-submenu {
  overflow: hidden;
  display: none;
  background: #ffffff1c;
  padding-bottom: 10px;
}
.submenu a, .submenu-item {
  display: flex;
  padding: 10px 0;
  text-decoration: none;
  color: #ecf0f1;
  gap: 10px;
  padding-left: 30px;
  font-size: 12px;
}
.sub-submenu a {
  display: block;
  padding: 10px 20px;
  text-decoration: none;
  color: #ecf0f1;
  background: #526a82;
padding-left:65px;
}

.arrow {
  margin-left: 5px;
}
.menu-item:hover, .menu-item.active{
  background: #ffffff1c;
  border-bottom: 1px solid #00000033;
}

.submenu-item:hover, .submenu-item.active{
  
border-right: 2px solid #32D0F3;
}
.menu-item:hover svg, .menu-item:hover span, .submenu-item:hover svg, .submenu-item:hover span, .menu-item.active svg, .menu-item.active span, .submenu-item.active svg, .submenu-item.active span{
  color: #32D0F3;
}
.top-head-left{
  display: flex;
  align-items: center;
  gap: 10px;
}
.top-head-left h1{
    font-size: 14px;
    font-weight: 400;
    color:#171717
}
.top-head-left h2{
    font-size: 13px;
    color: #7D8398;
    font-weight: 400;
    display: flex;
        align-items: center;
        gap: 5px;
}
.header_toggle{
  position: absolute;
  left: -12px;
  padding: 1px 5px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 9px;
  z-index: 99999999;
  bottom: -13px;
}
.header_toggle .toggle-rotate svg{
  transform: rotate(180deg);
}

.header_toggle svg{
  width: 18px;
  color: #393643;
  transform: rotate(
0deg);
  transition: 1s;
}

.top-head-left h2 svg{
  width:16px;
  color: #7D8398;
}
.top-head-left span{
    /*background: rgba(var(--bg-color), 0.6);*/
    background: #c1beff;
    color: var( --new-primary-color);
    padding: 4px 10px;
    border-radius: 58px;
    font-size: 13px;
    font-weight: 600;
}
.top-head-right{
    display: flex;
    align-items: center;
    gap: 10px;
}
.top-head-right span{
    border: 1px solid #E6E6E6;
    border-radius: 12px;
    padding: 13.5px;
    position: relative;
}
.top-head-right span svg{
    width: 20px;
    color: #7D8398;
    height: 20px;
}
.top-head-right span.active{
  background: var(--new-primary-color);
}
.top-head-right span.active svg{
  color: #fff;
}
.search-input-new span svg{
  width:15px;
}
button.btn {
}
button.btn-secondary svg{
  width: 14px;
}


 
  .dashboard-body {
    margin: 0;
    padding-left: 310px;
  }

  

  .l-navbar {
    left: 0;
   
  }

  .menu-show {
    width: 88px;
  }

  .body-pd {
    padding-left: 88px;
  }

  .main-content{
    overflow: hidden;
    padding: 0 30px;
    height: calc(100vh - 80px);
    overflow-y: auto;
  }

  .right-open{
    display: flex;
    gap: 30px;
  }
 
.min-logo {
  display: none;
  background: var(--logo-mini);
  background-size: cover;
  width: var(--logo-mini-width);
  height: var(--logo-mini-height);
}
.cus-logo{

background: var(--logo);

background-size: cover;

height: var(--logo-height);

width: var(--logo-width);

display: block;
}
.menu-show .cus-logo {
  display: none;
}

.menu-show .min-logo {
  display: inline-block;
}
.menu-show .nav_logo {

padding: 15.5px 10px;

text-align: center;

/* border: 0; */

border-color: #ffffff5c;

display: flex;

justify-content: center;

align-items: center;

height: 75px;
}

.menu-show .nav_logo .nav_link-box {
  display: inline-block;
}
.menu-show .menu-item span, .menu-show .submenu-item span{
  flex-grow: inherit;
  transition: 0.3s;
}
.main-filter{
  
display: flex;
  
justify-content: space-between;
  
padding: 25px 0;
  
gap: 10px;
}
.search-input-new{width: 250px !important;border-bottom: 1px solid #EBEBEB;}
.search-input-new svg{
    width: 20px;
    height: 20px;
    color: #7D8398;
}
.search-input-new input{
  font-size: 14px !important;
  color: #393643 !important;
  height: 44px !important;
}

.common-btn-new{
    background: var( --new-primary-color);
    border-radius: 12px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #fff;
    padding: 11px 19px;
    display: flex;
    align-items: center;
    gap: 7px;
    transition: 1s;
}
.outline-btn-new{
    border: 1px solid #EBEBEB;
    background: #fff;
    color: #393643;
}
.common-btn-new.blk{
  background: #000 !important;
}
.ai-btn{

background: linear-gradient(307deg, var( --new-primary-color), #9D55CE);

padding: 10.5px 9px;
}

.common-btn-new svg{
  color:#fff;
  width: 20px;
  height: 20px;
}
.outline-btn-new svg{
  color:#393643;
  
}

.main-table {
  font-family: 'Inter', sans-serif;
  background: #fff;
  border-radius: 12px;
  border: 1px solid #E6E6E6;
  overflow: hidden;
}

.main-table .table-responsive {
  width: 100%;
    /* controls fixed height */
  overflow-y: auto;
  position: relative;
  height: calc(100vh - 220px);
}
.right-pannel .main-table .table-responsive{
  height: calc(100vh - 150px);
}
.tab-pane .main-table .table-responsive, .inner-page-tab-navigation + .main-table .table-responsive{
  height: calc(100vh - 274px);
}
.right-pannel .main-table thead tr th:nth-child(1), .right-pannel .main-table table tr td:nth-child(1){
  padding-left: 23px !important;
}

.main-table .table {
  width: 100%;
  border-collapse: collapse;
}

.main-table .table thead {
  background-color: #F8F7FC;
}

.main-table .table th, .main-table .table td {
  padding: 8px 15px !important;
  text-align: left;
  border-bottom: 1px solid #dee2e6;
  vertical-align: middle;
  white-space: nowrap;
}

.main-table .table th {
  font-weight: 600;
  color: #333;
  background: #F8F7FC !important;
  position: sticky;
  top: 0;
  z-index: 2;
  font-size: 14px;
  color: #393643 !important;
  font-weight: 500;
  margin: 0;
  white-space: nowrap;
  text-transform: inherit;
}

.main-table .table th span {
  display: flex;
  gap: 5px;
  align-items: center;
}

.main-table .table th span h1 {
  font-size: 14px;
  color: #393643;
  font-weight: 500;
  margin: 0;
  white-space: nowrap;
  /* text-transform: capitalize; */
}

.main-table .table th span svg {
  width: 16px;
  height: 16px;
  color: #7D8398;
  display: none;
}
.main-table .table tr td{color: #393643;font-size: 14px !important;font-weight: 400;}
.main-table .table tr input[type='checkbox'] {
  width: 16px;
  height: 16px;
  border: .5px solid #7D83984D;
  border-radius: 4px;
}
.main-table .table tbody tr input[type='checkbox']{
  display: none;
}
.main-table .table tbody tr:hover input[type='checkbox'], .main-table .table tbody tr.active input[type='checkbox']{
  display: block;
}

.main-table .table tbody tr{
 
}
.main-table .table tbody tr:hover{
  background:#f50;
}



.main-table .table tbody tr:hover td, .main-table .table tbody tr.active td {
  border-top: 2px solid var( --new-primary-color);
  border-bottom: 2px solid var( --new-primary-color);
}

.main-table .table tbody tr:hover td:first-child, .main-table .table tbody tr.active td:first-child {
  border-left: 2px solid var( --new-primary-color);
}

.main-table .table tbody tr:hover td:last-child, .main-table .table tbody tr.active td:last-child {
  border-right: 2px solid var( --new-primary-color);
}

.main-table .col-span-box{
    justify-content: center;
}
.main-table .col-span-box h1 {
  font-size: 13px;
  text-align: center;
}
.main-table .table-pro-img{
    max-width: 32px;
    width: auto;
    max-height: 32px;
    margin-right: 7px;
}
.main-table .td-price-box{
    display: flex;
    align-items: center;
    gap: 8px;
    width: max-content;
}
.main-table .td-price-box img{
    width: auto;
}
.main-table .td-price-box div{}
.main-table .td-price-box div h2{
    font-weight: 500;
    font-size: 14px;
    margin-bottom: 3px;
}
.main-table .td-price-box div h3{
    font-size: 14px;
    color: #7D8398;
    font-weight: 500;
}
.main-table td .category{
  display: flex;
  align-items: center;
  gap: 7px;
}
.main-table td .category svg{
  width: 20px;
  height: 20px;
  color: #393643;
}

.main-table .table-responsive {
  position: relative;
  overflow: auto;
}

.main-table .table {
  width: 100%;
  border-collapse: collapse;
}



.main-table .tr-hover-btn {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Sticky headers only for the first header row */
/* =========================
   COMMON STYLES
   ========================= */
   .main-table .fixed-column th,
   .main-table .fixed-column td {
     background: #fff;
   }
   
   /* =========================
      WITH CHECKBOX (4 sticky cols)
      ========================= */
   .main-table .with-checkbox.fixed-column thead tr:first-child th:nth-child(1) {
     position: sticky;
     left: 0;
     width: 46px;
     min-width: 46px;
     max-width: 46px;
     z-index: 99;
   }
   .main-table .with-checkbox.fixed-column tbody td:nth-child(1) {
     position: sticky;
     left: 0;
     width: 46px;
     min-width: 46px;
     max-width: 46px;
     z-index: 2; /* body cells lower */
   }
   
   .main-table .with-checkbox.fixed-column thead tr:first-child th:nth-child(2) {
     position: sticky;
     left: 46px;
     width: 110px;
     min-width: 110px;
     max-width: 110px;
     z-index: 99;
   }
   .main-table .with-checkbox.fixed-column tbody td:nth-child(2) {
     position: sticky;
     left: 46px;
     width: 110px;
     min-width: 110px;
     max-width: 110px;
     z-index: 2;
   }
   
   .main-table .with-checkbox.fixed-column thead tr:first-child th:nth-child(3) {
     position: sticky;
     left: 156px;
     width: 120px;
     min-width: 120px;
     max-width: 120px;
     z-index: 99;
     box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15); /* right shadow */
   }
   .main-table .with-checkbox.fixed-column tbody td:nth-child(3) {
     position: sticky;
     left: 156px;
     width: 120px;
     min-width: 120px;
     max-width: 120px;
     z-index: 9 !important;
     box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15);
   }
   
   .main-table .with-checkbox.fixed-column thead tr:first-child th:nth-child(4) {
     position: sticky;
     left: 276px;
     width: 270px;
     min-width: 270px;
     max-width: 270px;
     z-index: 99;
   }
   .main-table .with-checkbox.fixed-column tbody td:nth-child(4) {
     position: sticky;
     left: 276px;
     width: 270px;
     min-width: 270px;
     max-width: 270px;
     z-index: 9 !important;
   }
   
   /* Right border for last fixed column */
   .main-table .with-checkbox.fixed-column thead tr:first-child th:nth-child(4)::after,
   .main-table .with-checkbox.fixed-column tbody td:nth-child(4)::after {
     content: "";
     position: absolute;
     top: 0;
     right: 0;
     width: 0;
     height: 100%;
     border-right: 6px double #EBEBEB;
     z-index: 4;
     pointer-events: none;
   }
   
   /* =========================
      NO CHECKBOX (3 sticky cols)
      ========================= */
   .main-table .no-checkbox.fixed-column thead tr:first-child th:nth-child(1) {
     position: sticky;
     left: 0;
     width: 110px; /* was col2 */
     min-width: 110px;
     max-width: 110px;
     z-index: 99;
   }
   .main-table .no-checkbox.fixed-column tbody td:nth-child(1) {
     position: sticky;
     left: 0;
     width: 110px;
     min-width: 110px;
     max-width: 110px;
     z-index: 2;
   }
   
   .main-table .no-checkbox.fixed-column thead tr:first-child th:nth-child(2) {
     position: sticky;
     left: 110px;
     width: 120px; /* was col3 */
     min-width: 120px;
     max-width: 120px;
     z-index: 99;
     box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15);
   }
   .main-table .no-checkbox.fixed-column tbody td:nth-child(2) {
     position: sticky;
     left: 110px;
     width: 120px;
     min-width: 120px;
     max-width: 120px;
     z-index: 9 !important;
     box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15);
   }
   
   .main-table .no-checkbox.fixed-column thead tr:first-child th:nth-child(3) {
     position: sticky;
     left: 230px;
     width: 270px; /* was col4 */
     min-width: 270px;
     max-width: 270px;
     z-index: 99;
   }
   .main-table .no-checkbox.fixed-column tbody td:nth-child(3) {
     position: sticky;
     left: 230px;
     width: 270px;
     min-width: 270px;
     max-width: 270px;
     z-index: 9 !important;
   }
   
   /* Right border for last fixed column */
   .main-table .no-checkbox.fixed-column thead tr:first-child th:nth-child(3)::after,
   .main-table .no-checkbox.fixed-column tbody td:nth-child(3)::after {
     content: "";
     position: absolute;
     top: 0;
     right: 0;
     width: 0;
     height: 100%;
     border-right: 6px double #EBEBEB;
     z-index: 4;
     pointer-events: none;
   }
   



   .main-table .no-checkbox-with-no-action.fixed-column thead tr:first-child th:nth-child(1) {
    position: sticky;
    left: 0;
    width: 120px; /* was col3 */
    min-width: 120px;
    max-width: 120px;
    z-index: 99;
    box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15);
  }
  .main-table .no-checkbox-with-no-action.fixed-column tbody td:nth-child(1) {
    position: sticky;
    left: 0;
    width: 120px;
    min-width: 120px;
    max-width: 120px;
    z-index: 9 !important;
    box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15);
  }
  
  .main-table .no-checkbox-with-no-action.fixed-column thead tr:first-child th:nth-child(2) {
    position: sticky;
    left: 120px;
    width: 270px; /* was col4 */
    min-width: 270px;
    max-width: 270px;
    z-index: 99;
  }
  .main-table .no-checkbox-with-no-action.fixed-column tbody td:nth-child(2) {
    position: sticky;
    left: 120px;
    width: 270px;
    min-width: 270px;
    max-width: 270px;
    z-index: 9 !important;
  }
  
  /* Right border for last fixed column */
  .main-table .no-checkbox-with-no-action.fixed-column thead tr:first-child th:nth-child(2)::after,
  .main-table .no-checkbox-with-no-action.fixed-column tbody td:nth-child(2)::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 100%;
    border-right: 6px double #EBEBEB;
    z-index: 4;
    pointer-events: none;
  }
  

  .main-table .with-checkbox-with-no-action.fixed-column thead tr:first-child th:nth-child(1) {
    position: sticky;
    left: 0;
    width: 46px;
    min-width: 46px;
    max-width: 46px;
    z-index: 99;
  }
  .main-table .with-checkbox-with-no-action.fixed-column tbody td:nth-child(1) {
    position: sticky;
    left: 0;
    width: 46px;
    min-width: 46px;
    max-width: 46px;
    z-index: 2; /* body cells lower */
  }
  

  .main-table .with-checkbox-with-no-action.fixed-column thead tr:first-child th:nth-child(2) {
    position: sticky;
    left: 46px;
    width: 120px;
    min-width: 120px;
    max-width: 120px;
    z-index: 99;
    box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15); /* right shadow */
  }
  .main-table .with-checkbox-with-no-action.fixed-column tbody td:nth-child(2) {
    position: sticky;
    left: 46px;
    width: 120px;
    min-width: 120px;
    max-width: 120px;
    z-index: 9 !important;
    box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15);
  }
  
  .main-table .with-checkbox-with-no-action.fixed-column thead tr:first-child th:nth-child(3) {
    position: sticky;
    left: 166px;
    width: 270px;
    min-width: 270px;
    max-width: 270px;
    z-index: 99;
  }
  .main-table .with-checkbox-with-no-action.fixed-column tbody td:nth-child(3) {
    position: sticky;
    left: 166px;
    width: 270px;
    min-width: 270px;
    max-width: 270px;
    z-index: 9 !important;
  }
  
  /* Right border for last fixed column */
  .main-table .with-checkbox-with-no-action.fixed-column thead tr:first-child th:nth-child(3)::after,
  .main-table .with-checkbox-with-no-action.fixed-column tbody td:nth-child(3)::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 100%;
    border-right: 6px double #EBEBEB;
    z-index: 4;
    pointer-events: none;
  }
  






   
   .main-table .seller-fixed-column th,
.main-table .seller-fixed-column td {
  background: #fff;
}

/* =========================
   WITH CHECKBOX (4 sticky cols)
   ========================= */
.main-table .with-checkbox.seller-fixed-column thead tr:first-child th:nth-child(1) {
  position: sticky;
  left: 0;
  width: 46px;
  min-width: 46px;
  max-width: 46px;
  z-index: 99;
}
.main-table .with-checkbox.seller-fixed-column tbody td:nth-child(1) {
  position: sticky;
  left: 0;
  width: 46px;
  min-width: 46px;
  max-width: 46px;
  z-index: 2; /* body cells lower */
}

.main-table .with-checkbox.seller-fixed-column thead tr:first-child th:nth-child(2) {
  position: sticky;
  left: 46px;
  width: 75px;
  min-width: 75px;
  max-width: 75px;
  z-index: 99;
}
.main-table .with-checkbox.seller-fixed-column tbody td:nth-child(2) {
  position: sticky;
  left: 46px;
  width: 75px;
  min-width: 75px;
  max-width: 75px;
  z-index: 2;
}

.main-table .with-checkbox.seller-fixed-column thead tr:first-child th:nth-child(3) {
  position: sticky;
  left: 121px;
  width: 280px;
  min-width: 280px;
  max-width: 280px;
  z-index: 99;
  box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15); /* right shadow */
}
.main-table .with-checkbox.seller-fixed-column tbody td:nth-child(3) {
  position: sticky;
  left: 121px;
  width: 280px;
  min-width: 280px;
  max-width: 280px;
  z-index: 9 !important;
  box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15);
}


/* Right border for last fixed column */
.main-table .with-checkbox.seller-fixed-column thead tr:first-child th:nth-child(3)::after,
.main-table .with-checkbox.seller-fixed-column tbody td:nth-child(3)::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 0;
  height: 100%;
  border-right: 6px double #EBEBEB;
  z-index: 4;
  pointer-events: none;
}

/* =========================
   NO CHECKBOX (3 sticky cols)
   ========================= */
.main-table .no-checkbox.seller-fixed-column thead tr:first-child th:nth-child(1) {
  position: sticky;
  left: 0;
  width: 75px; /* was col2 */
  min-width: 75px;
  max-width: 75px;
  z-index: 99;
}
.main-table .no-checkbox.seller-fixed-column tbody td:nth-child(1) {
  position: sticky;
  left: 0;
  width: 75px;
  min-width: 75px;
  max-width: 75px;
  z-index: 2;
}

.main-table .no-checkbox.seller-fixed-column thead tr:first-child th:nth-child(2) {
  position: sticky;
  left: 75px;
  width: 270px; /* was col3 */
  min-width: 270px;
  max-width: 270px;
  z-index: 99;
  box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15);
}
.main-table .no-checkbox.seller-fixed-column tbody td:nth-child(2) {
  position: sticky;
  left: 75px;
  width: 270px;
  min-width: 270px;
  max-width: 270px;
  z-index: 9 !important;
  box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15);
}


/* Right border for last fixed column */
.main-table .no-checkbox.seller-fixed-column thead tr:first-child th:nth-child(2)::after,
.main-table .no-checkbox.seller-fixed-column tbody td:nth-child(2)::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 0;
  height: 100%;
  border-right: 6px double #EBEBEB;
  z-index: 4;
  pointer-events: none;
}



  
.main-table .no-checkbox-with-no-action.seller-fixed-column thead tr:first-child th:nth-child(1) {
  position: sticky;
  left: 0px;
  width: 330px; /* was col3 */
  min-width: 330px;
  max-width: 330px;
  z-index: 99;
  box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15);
}
.main-table .no-checkbox-with-no-action.seller-fixed-column tbody td:nth-child(1) {
  position: sticky;
  left: 0px;
  width: 330px;
  min-width: 330px;
  max-width: 330px;
  z-index: 9 !important;
  box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15);
}


/* Right border for last fixed column */
.main-table .no-checkbox-with-no-action.seller-fixed-column thead tr:first-child th:nth-child(1)::after,
.main-table .no-checkbox-with-no-action.seller-fixed-column tbody td:nth-child(1)::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 0;
  height: 100%;
  border-right: 6px double #EBEBEB;
  z-index: 4;
  pointer-events: none;
}


/* =========================
   WITH CHECKBOX (4 sticky cols)
   ========================= */
   .main-table .with-checkbox.brand-fixed-column thead tr:first-child th:nth-child(1) {
    position: sticky;
    left: 0;
    width: 46px;
    min-width: 46px;
    max-width: 46px;
    z-index: 99;
  }
  .main-table .with-checkbox.brand-fixed-column tbody td:nth-child(1) {
    position: sticky;
    left: 0;
    width: 46px;
    min-width: 46px;
    max-width: 46px;
    z-index: 2; /* body cells lower */
  }
  
  .main-table .with-checkbox.brand-fixed-column thead tr:first-child th:nth-child(2) {
    position: sticky;
    left: 46px;
    width: 280px;
    min-width: 280px;
    max-width: 280px;
    z-index: 99;
  }
  .main-table .with-checkbox.brand-fixed-column tbody td:nth-child(2) {
    position: sticky;
    left: 46px;
    width: 280px;
    min-width: 280px;
    max-width: 280px;
    z-index: 2;
  }
  
  
  /* Right border for last fixed column */
  .main-table .with-checkbox.brand-fixed-column thead tr:first-child th:nth-child(2)::after,
  .main-table .with-checkbox.brand-fixed-column tbody td:nth-child(2)::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 100%;
    border-right: 6px double #EBEBEB;
    z-index: 4;
    pointer-events: none;
  }
  
  /* =========================
     NO CHECKBOX (3 sticky cols)
     ========================= */
  .main-table .no-checkbox.brand-fixed-column thead tr:first-child th:nth-child(1) {
    position: sticky;
    left: 0;
    width: 280px;
    min-width: 280px;
    max-width: 280px;
    z-index: 99;
  }
  .main-table .no-checkbox.brand-fixed-column tbody td:nth-child(1) {
    position: sticky;
    left: 0;
    width: 280px;
    min-width: 280px;
    max-width: 280px;
    z-index: 2;
  }
  
  
  
  /* Right border for last fixed column */
  .main-table .no-checkbox.brand-fixed-column thead tr:first-child th:nth-child(1)::after,
  .main-table .no-checkbox.brand-fixed-column tbody td:nth-child(1)::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 100%;
    border-right: 6px double #EBEBEB;
    z-index: 4;
    pointer-events: none;
  }
  
  .main-table .no-checkbox.product-list-fixed-column thead tr:first-child th:nth-child(1) {
    position: sticky;
    left: 0;
    width: 56px;
    min-width: 56px;
    max-width: 56px;
    z-index: 99;
  }
  .main-table .no-checkbox.product-list-fixed-column tbody td:nth-child(1) {
    position: sticky;
    left: 0;
    width: 56px;
    min-width: 56px;
    max-width: 56px;
    z-index: 2; /* body cells lower */
  }
  
  .main-table .no-checkbox.product-list-fixed-column thead tr:first-child th:nth-child(2) {
    position: sticky;
    left: 56px;
    width: 75px;
    min-width: 75px;
    max-width: 75px;
    z-index: 99;
  }
  .main-table .no-checkbox.product-list-fixed-column tbody td:nth-child(2) {
    position: sticky;
    left: 56px;
    width: 75px;
    min-width: 75px;
    max-width: 75px;
    z-index: 2;
  }
  
  .main-table .no-checkbox.product-list-fixed-column thead tr:first-child th:nth-child(3) {
    position: sticky;
    left: 131px;
    width: 280px;
    min-width: 280px;
    max-width: 280px;
    z-index: 99;
    box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15); /* right shadow */
  }
  .main-table .no-checkbox.product-list-fixed-column tbody td:nth-child(3) {
    position: sticky;
    left: 131px;
    width: 280px;
    min-width: 280px;
    max-width: 280px;
    z-index: 9 !important;
    box-shadow: 5px 0 8px rgba(0, 0, 0, 0.15);
  }
  
  
  /* Right border for last fixed column */
  .main-table .no-checkbox.product-list-fixed-column thead tr:first-child th:nth-child(3)::after,
  .main-table .no-checkbox.product-list-fixed-column tbody td:nth-child(3)::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 100%;
    border-right: 6px double #EBEBEB;
    z-index: 4;
    pointer-events: none;
  }
  

  

.main-table thead tr:nth-child(1) th {
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 3;
}

.main-table thead tr:nth-child(2) th {
  position: sticky;
  top: 32px;
  background: #f9f9f9;
  z-index: 9;
}

.main-table thead th {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}
.main-table .table tr:hover td {
  background-color: #F5F7FF;
}
.main-table .tr-hover-btn button.chart {
    background: #393643;
    border-color: #393643;
}
.main-table .tr-hover-btn button.chart svg{width: 16px;height: 16px;color: #fff;}
.main-table .tr-hover-btn button{
  
width: 32px;
  
height: 32px;
  
border-radius: 100%;
  
border: 1px solid;
}
.main-table .tr-hover-btn button.view {border-color: #5E5ADB;background: #fff;color: #5E5ADB;}
.main-table .tr-hover-btn button.view svg{
    width: 16px;
    height: 16px;
}
.main-box{}
.left-box{
    transition: 1s;
    width: 100%;
}
.right-box{
 
transition: 1s;
 
position: absolute;
 

 
right: 0;
 
bottom: 0;
 
top: 75px;
 
width: 0;
}
.right-open .left-box{
  width: calc(100% - 549px);
}
  .right-open .right-box{
  width: 549px;
}

.right-pannel{
    height: 100%;
    box-shadow: -6px -0 17px var( --new-primary-color)26;
}
.right-pannel .heading{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 23px;
}
.right-pannel .heading h1{
    font-size: 15px;
    font-weight: 600;
    color: #171717;
}
.right-pannel .heading span{
  cursor: pointer;
}
.right-pannel .heading span svg{
  width: 20px;
  height: 20px;
  color: #171717;
}

.right-pannel .main-table{
  border-radius: 0;
  border: none;
}

.right-pannel .table th span h1{
  font-size: 12px;
}
.right-pannel .table th span h1 label{
  color:#9F9DA4
}

.right-pannel .table th{
  padding: 10px 10px !important;
}
.right-pannel .table td{
  padding: 10px 10px !important;
}

.right-pannel .table tr td{
    font-size: 13px !important;
}
.pro-name-wi-brand{}
.pro-name-wi-brand span{
    font-size: 12px;
    background: #E0ECFF;
    color: var( --new-primary-color);
    border-radius: 58px;
    padding: 5px 11px;
    margin-bottom: 3px;
    display: inline-block;
    font-weight: 500 !important;
}
.right-pannel .table tr td h3{
  font-size: 12px;
  color: #909090;
  margin-top: 5px;
}

.right-pannel .table tr td h3 span{
  color:#7D8398;
  font-size: 12px;
  font-weight: 300;
}
.right-pannel .table tr td span{
  color:#7D8398;
  font-size: 12px;
  font-weight: 300;
}
.right-pannel .table tr td svg{
  width: 20px;
  height: 20px;
  color: #7D8398;
}
.drob-btn{
  position: relative;
}
.header-drop-down-box{
    position: absolute;
    width: 320px;
    right: 0;
    z-index: 999;
    padding-top: 20px;
    display: none;
  }
  /* .drob-btn:hover .header-drop-down-box{
    display: block;
  } */
  .header-drop-down-box.show {
    display: block;
  }
.header-drop-down{
    
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0px 0px 9px #0000001f;
}
.header-drop-down .header-drop-down-heading{
    background: #F9F9F9;
    display: flex;
    justify-content: space-between;
    padding: 11.5px 15px;
    border: 1px solid #EBEBEB;
    align-items: center;
}
.header-drop-down .header-drop-down-heading h1{
    font-size: 14px;
    font-weight: 600;
    color: #000;
}
.header-drop-down .header-drop-down-heading span{
    padding: 0;
    border: 0;
}
.header-drop-down .header-drop-down-heading svg{
    width: 15px;
}
.header-drop-down .header-drop-down-content{
    padding: 15px;
    max-height: 400px;
    overflow: auto;
}
.header-drop-down .header-drop-down-content .input-group{
width: auto !important;
}
.header-drop-down .header-drop-down-content .heading{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.header-drop-down .header-drop-down-content .heading h1{
    font-size: 13px;
    color: #7D8398;
    font-weight: 400;
    margin-bottom: 5px;
}
.header-drop-down .header-drop-down-content .heading span{
    font-size: 13px;
    color: #4183EC;
    font-weight: 500;
}
.header-drop-down .header-drop-down-content ul{
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.header-drop-down .header-drop-down-content ul li{
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.header-drop-down .header-drop-down-content ul li ul{
    padding-left: 25px;
    padding-top: 15px;
    height: auto;
}
.header-drop-down .header-drop-down-content ul li ul li{}
.form-check-input[type="checkbox"] {
  --bs-form-check-bg-image: none;
  appearance: none;
  width: 16px;
  height: 16px;
  border: 2px solid #ccc;
  border-radius: 4px;
  background-color: #ffffff; /* Unchecked background */
  cursor: pointer;
  transition: all 0.3s ease;
  margin: 0;
}

.form-check-input[type="checkbox"]:checked {
  background-color: #5E5ADB;   /* Checked background */
  border-color: #5E5ADB;
  --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='white' d='M6.173 11.414L2.293 7.535l1.414-1.414L6.173 8.586l6.121-6.121 1.414 1.414z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 15px;
}

.form-check-input:focus {
  box-shadow: none;
  outline: none;
}

.header-drop-down .header-drop-down-footer{
    background: #F9F9F9;
    padding: 10px 15px;
    display: flex;
    justify-content: space-between;
}
.header-drop-down .header-drop-down-footer button{
    font-size: 13px;
    font-weight: 500;
    padding: 10px 15px;
    border-radius: 10px;
}
.header-drop-down .header-drop-down-footer button.cnl{
    background: #fff;
    color: #121212;
    border: 1px solid #EBEBEB;
}
.header-drop-down .header-drop-down-footer button.sve{
    background: var( --new-primary-color);
    color: #fff;
    border: 1px solid var( --new-primary-color);
}
.form-check-input[type="radio"] {
  --bs-form-check-bg-image: none;        /* Remove default icon */
  width: 16px;
  height: 16px;
  border: 1px solid #ccc;
  border-radius: 50%;
  background-color: #fff;             /* Background when unchecked */
  cursor: pointer;
  transition: all 0.3s ease;
  margin: 0;
  padding: 0;
}

.form-check-input[type="radio"]:checked {
  background-color: #ffffff !important;             /* Background when checked */
  border-color: #5E5ADB !important;
  --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%235E5ADB'/%3e%3c/svg%3e") !important;
  background-size: 16px;
}

.form-check-input:focus {
  box-shadow: none;
  outline: none;
}

.form-check label{

color: #545454;

font-size: 13px;

font-weight: 500;

line-height: normal;

margin: 0;
}
.header-drop-down-content .form-check{
  display: flex;
  align-items: center;
  gap: 10px;
}
.date-time-row{}
.date-time-row h1{
    text-align: left;
    font-size: 13px;
    font-weight: 400;
    color: #7D8398;
    margin-bottom: 5px;
}
.date-time-row input, .header-drop-down-content select{
    font-size: 12px !important;
    font-weight: 400;
    border: 1px solid #EBEBEB !important;
    padding: 10px 12px !important;
    border-radius: 10px !important;
    width: 100%;
    color: #b5b5b5;
}

.setting-dropdown-menu-box{
    position: absolute;
    right: 0;
    width: 250px;
    z-index: 9999;
    padding-top: 30px;
}
.top-head-right span:hover .setting-dropdown-menu-box{
}
.setting-dropdown-menu-box .setting-dropdown-menu{
    display: flex;
    flex-direction: column;
    background: #fff;
    box-shadow: 2px 2px 10px #dddddd;
    border-radius: 10px;
    border: 1px solid #EBEBEB;
}
.setting-dropdown-menu-box .setting-dropdown-menu a{
    padding: 15px 20px;
    display: flex;
    justify-content: space-between;
    position: relative;
    color: #7D8398;
}
.setting-dropdown-menu-box .setting-dropdown-menu a svg.arrow{}
.setting-dropdown-menu-box .setting-dropdown-menu a span{
    padding: 0;
    border: 0;
    position: inherit;
    font-size: 13px;
    font-weight: 500;
}
.setting-dropdown-menu-box .setting-dropdown-menu a span svg{color: var( --new-primary-color);margin-right: 10px;}
.setting-dropdown-menu-box .setting-dropdown-menu a .sub-drop-menu-box{
  position: absolute;
  width: 250px;
  z-index: 9999;
  left: -250px;
  padding-right: 15px;
  box-sizing: border-box;
  /* display: none; */
}
.setting-dropdown-menu a:hover .sub-drop-menu-box {
  /* display: block; */
}
.setting-dropdown-menu-box .setting-dropdown-menu a .sub-drop-menu-box .sub-drop-menu{
  display: flex;
  flex-direction: column;
  background: #fff;
  box-shadow: 2px 2px 10px #dddddd;
  border-radius: 10px;
  border: 1px solid #EBEBEB;
}

.setting-dropdown-menu-box .setting-dropdown-menu a:hover{
  color: var( --new-primary-color);
}
.setting-dropdown-menu-box .setting-dropdown-menu a:hover .arrow svg{
  color: var( --new-primary-color);
}

.log-out-top{
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 6px 8px!important;
}
.log-out-top span{
    background: var( --new-primary-nav-bar-color);
    font-weight: 700;
    color: #fff;
    padding: 10px !important;
    border: 0;
    font-size: 13px;
}
.log-out-top div{}
.log-out-top div h1{
    font-size: 12px;
    color: #5e5e5e;
}
.log-out-top div label{
    color: var( --new-primary-color);
    font-weight: 500;
    cursor: pointer;
}
.map-tab {
  justify-content: start;
  flex-direction: row !important;
  border-bottom: 1px solid #cacaca !important;
  gap: 20px;
  /* padding-bottom: 10px; */
}

.map-tab button {
  border-radius: 0 !important;
  padding: 0 20px 5px 20px;
  color: #393643 !important;
  height: 100%;
  font-size: 14px;
  font-family: "Inter", sans-serif;
  background: #fff !important;
  border: 0 !important;
  font-weight: 400;
}


.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
  color: #252B37;
  border-bottom: 4px solid var( --new-primary-color) !important;
  margin-bottom: -2px;
  z-index: 99;
  font-weight: 600;
  border: 0;
}
.auth-buy-box-seller{
    display: flex;
    gap: 10px;
}
.auth-buy-box-seller span{
    border-radius: 100%;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.auth-buy-box-seller span img{width: 14px;}
.auth-buy-box-seller span.auth-sell{background:#04B68D;}
.auth-buy-box-seller span.buy-sell{background:#B54708 ;}
.auth-buy-box-seller span.auth-sell-gray{background: #DADADA;}
.pagina-select {
  background: var( --new-primary-color);
  color: #ffffff;
  height: 1.5rem;
  border-radius: 3px;
  font-size: 12px;
  font-weight: 500;
  border: 0;
}
.p-paginator {
  background: transparent !important;
  justify-content: end !important;
  padding: 9px 9px !important;
}

.p-paginator .p-paginator-pages .p-paginator-page.p-highlight {
  color: #fff !important;
  min-width: 1rem;
  border: 2px solid var( --new-primary-color) !important;
  height: 1rem;
  border: 0 !important;
  font-weight: bold;
  background: var( --new-primary-color) !important;
}

.p-paginator .p-paginator-pages .p-paginator-page {
  background: #f2f1ff !important;
  min-width: 1.3rem !important;
  height: 1.3rem !important;
  border-radius: 100% !important;
  color: #535353 !important;
  font-weight: 500;
}

.p-paginator .p-dropdown {}

 
.seller-mail-action{
    gap: 10px;
    display: flex;
}
.seller-mail-action span{
    font-size: 12px;
    font-weight: 500;
    
    padding: 10px 17px;
    
    border-radius: 12px;
}
.seller-mail-action span svg{
    width: 20px;
    height: 20px;
}
.seller-mail-action span.mail{background: #EEEDFF; color: var( --new-primary-color);}
.seller-mail-action span.time{background: #F5F8FF; color: #155EEF;}
.mail-box{
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 0 25px;
    height: calc(100vh - 85px);
}
.mail-box .mail-input{
    height: 40px;
    border: 1px solid #E9EAEB;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}
.mail-box .mail-input input{width: 100%;height: 100%;padding-left: 65px;font-size: 13px;}
.mail-box .mail-input label{
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    background: #F5F5F5;
    width: 55px;
    justify-content: center;
}
.mail-box .mail-input input.subject{
  padding-left: 15px;
}

.mail-msg{}
.mail-msg label{
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    color: #252B37;
}
.mail-msg textarea{
  height: 300px;
  border: 1px solid #E9EAEB;
  border-radius: 10px;
  overflow: auto;
  width: 100%;
  padding: 15px;
}

.mail-cont{
  margin: 0 -25px;
  height: 90%;
  overflow: scroll;
}
.mail-cont .mail-list{
    display: flex;
    gap: 60px;
    align-items: center;
    padding: 15px 23px;
    border-bottom: 1px solid #3936431F;
}
.mail-cont .mail-list h1{
    font-size: 15px;
    font-weight: 600;
    color: #171717;
}
.mail-cont .mail-list p{
    font-size: 12px;
    color: #717680;
    font-weight: 400;
    margin-top: 6px;
    margin-bottom: 0;
}
.mail-cont .mail-list p a{}
.mail-cont .mail-list svg{
    width: 16px;
    height: 16px;
    color: #A4A7AE;
    margin-bottom: 6px;
}
.mail-cont .mail-list span{
    font-size: 11px;
    color: #717680;
    font-weight: 400;
    white-space: nowrap;
}
.mail-cont .mail-list .date-box{
  display: flex;
      flex-direction: column;
      align-items: end;
}

.suggest-price{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.suggest-price div{
  display: flex;
  gap: 10px;
  align-items: center;
}
.suggest-price div span{
    background: linear-gradient(
90deg, #006EFF, #27BFBF);
    border-radius: 100%;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.suggest-price div span img{
    width: 14px;
}
.suggest-price div svg{
    width: 17px;
    color: var( --new-primary-color);
}

.modal-content{
  border-radius: 24px !important;
  
}
.modal-header{
  background:#F8F7FC;
  border-radius: 24px 24px 0 0 !important;
  border: 0 !important;
}
.modal-header h1{
  font-size: 15px !important;
  color: #171717;
  font-weight: 600;
  border-radius: 24px 24px 0 0;
}

.modal-header .cus-btn-cls{
  position: absolute;
  right: -12px;
  top: -12px;
  color: #fff;
  font-weight: 700;
}

.rule-pop{
    overflow-x: hidden;
}
.rule-pop h3{
    font-size: 14px;
    color: #393643;
    margin-bottom: 12px;
}
.rule-pop input, select.rule-sel{
    border-radius: 8px;
    border: 1px solid #EBEBEB;
    height: 40px;
    width: 100%;
    font-size: 12px;
    padding: 0 10px;
    padding: 0 10px;
}
.rule-pop p{
    font-size: 12px;
    font-weight: 400;
    margin: 0px !important;
    display: inline-flex;
    flex-wrap: wrap;
    gap: 5px 15px;
    align-items: center;
    width: 100%;
}
.rule-pop p select, .rule-pop p input{
    border: 0;
    border-bottom: 1px solid #EBEBEB;
    margin: 0 15px;
    width: 150px;
    color: #838383;
    height: 40px;
    border-radius: 0;
    padding: 0 10px;
}
.line{
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 15px;
    margin-top: 15px !important;
}
.line span{
    border: 1px dashed #C8C8C8;
    width: 100%;
    display: block;
}
.line a{
    font-size: 14px;
    color: var( --new-primary-color);
    font-weight: 400;
    white-space: nowrap;
}

.freq-btn button{
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #EBEBEB !important;
    border-radius: 9px;
    width: 100%;
    padding: 8px 6px !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #393643;
}
.freq-btn button.active, .freq-btn button:hover{
  background:var( --new-primary-color);
color: #fff;
}
.rule-appe-box{
    background: #F5F9FF;
    border-radius: 24px;
    padding: 25px 20px;
}
.day-list{
    margin-top: 10px;
    display: flex;
    gap: 5px;
}
.day-list span{font-size: 13px;color: #393643;background: #fff;border-radius: 9px;border: 1px solid #EBEBEB;padding: 7px 13px;display: inline-block;}
.day-list span.active, .day-list span:hover{background:var( --new-primary-color);
  color: #fff;}
.modal-footer{
  background: #F8F7FC;
    padding: 5px 15px;
    border: 0;
}
.modal-dialog-scrollable .modal-content{
  overflow: inherit;
}
.rule-btn{
    background: linear-gradient(
272deg, #27BFBF, var( --new-primary-color));
}
.rule-btn-outline{
  
  }

  .gradient-border {
    position: relative;
    border-radius: 14px !important; /* your radius */
    /* padding: 9.5px 9px 9.5px 9px; */ /* space inside */
    background: linear-gradient(88deg, #615BE2, #F662AF); /* gradient border */
  }
  
  /* Inner content with background (to prevent full gradient fill) */
  .gradient-border::before {
    content: "";
    position: absolute;
    inset: 1px; /* border thickness */
    border-radius: 12px; /* radius = parent radius - inset */
    background: #fff; /* inner background */
    z-index: 0;
  }
  
  .gradient-border > * {
    position: relative;
    z-index: 1;
  }
  
  .gradient-text {
    background: linear-gradient(272deg, #27BFBF, var( --new-primary-color));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    display: flex;
    gap: 7px;
    align-items: center;
  }
  .gradient-text svg{
    color: var( --new-primary-color);
  }

  .right-open .main-filter .common-btn-new{
    font-size: 0 !important;
    gap: 0 !important;
    transition: 1s;
  }

  .right-open .main-filter .common-btn-new .gradient-text{
    gap: 0;
    transition: 1s;
  }

  .gauge {
    width: 55px;          /* adjust as needed */
    display: block;
  }
  /* Optional: responsive sizing when parent is flexible */
  .gauge {
    max-width: 100%;
    height: auto;
  }

  .gauge-with-text{

display: flex;

align-items: center;

gap: 10px;

}



.con-ui-pop-pro-name{
    display: flex;
    gap: 25px;
    width: 60%;
}
.con-ui-pop-pro-name span{
    width: 64px;
    height: auto;
}
.con-ui-pop-pro-name span img{
    width: 100%;
}
.con-ui-pop-pro-name .head{
  width: calc(100% - 89px);
}
.con-ui-pop-pro-name h4{
    font-size: 12px;
    color: #717680;
    font-weight: 500;
    margin-bottom: 9px;
}
.con-ui-pop-pro-name h1{}
.con-ui-pop-pgs-cir{
    display: flex;
    gap: 20px;
    align-items: center;
}
.con-ui-pop-pgs-cir span{width: 70px;}
.con-ui-pop-pgs-cir span img{
    width: 100%;
}
.con-ui-pop-pgs-cir h3{
    color: #7D8398;
    font-size: 13px;
    font-weight: 500;
}

.conten-audit-ui-pop-cont-box{
  display: flex;
}

.conten-audit-ui-pop-cont-box .left-cont-box{
    position: fixed;
    width: 300px;
    padding-right: 25px;
    border-right: 1px solid #E6E6E6;
    height: 585px;
    overflow: auto;
}
.conten-audit-ui-pop-cont-box .left-cont-box h1{
    font-size: 13px;
    font-weight: 600;
    color: #7D8398;
    text-transform: uppercase;
}
.conten-audit-ui-pop-cont-box .left-cont-box ul{
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 20px;
    height: calc((100vh - 1.75rem * 2) - 225px);
    overflow: auto;
}
.conten-audit-ui-pop-cont-box .left-cont-box ul li{}
.conten-audit-ui-pop-cont-box .left-cont-box ul li a{
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: space-between;
    cursor: pointer;
}
.conten-audit-ui-pop-cont-box .left-cont-box ul li a div{
  display: flex;
  gap: 10px;
  align-items: center;
}
.conten-audit-ui-pop-cont-box .left-cont-box ul li a img{
    width: 24px;
    height: 24px;
}
.conten-audit-ui-pop-cont-box .left-cont-box ul li a span{
    font-size: 13px;
    color: #393643;
    font-weight: 500;
    white-space: nowrap;
}
.conten-audit-ui-pop-cont-box .left-cont-box ul li a.active span{
  color: var( --new-primary-color);
  font-weight: 600;
}
.conten-audit-ui-pop-cont-box .left-cont-box ul li a:hover span{
  color: var( --new-primary-color);
    font-weight: 600;
}
.conten-audit-ui-pop-cont-box .left-cont-box ul li a app-meter-pointer{
    width: 65px;
    display: flex;
    align-items: center;
}
.conten-audit-ui-pop-cont-box .left-cont-box ul li a app-meter-pointer .gauge-with-text span{
  font-size: 9px;
  width: 46px;
  line-height: 0;
}
.conten-audit-ui-pop-cont-box .right-cont-box{
    width: calc(100% - 300px);
    margin-left: 300px;
    padding-left: 25px;
}
.conten-audit-ui-pop-cont{
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-bottom: 30px;
}
.conten-audit-ui-pop-cont textarea{
  border-radius: 12px;
  width: calc(100% + 34px);
  color: #393643;
  font-size: 12px;
  background: #f7f7f7;
  padding: 11px 18px;
  margin: -10px -10px -15px -17px;
}
.conten-audit-ui-pop-cont h1{
    font-size: 18px;
    color: #393643;
    font-weight: 600;
    margin-bottom: 5px;
}
.conten-audit-ui-pop-cont h4{
    font-size: 13px;
    color: #7D8398;
    font-weight: 400;
    display: flex;
    align-items: center;
    gap: 7px;
}
.conten-audit-ui-pop-cont h4 span{
}
.conten-audit-ui-pop-cont h4 span svg{width: 16px;color: #C4C4C4;display: none;}
.conten-audit-ui-pop-cont p{
    color: #393643;
}
.conten-audit-ui-pop-cont .cus-border{
    border: 1px solid #EBEBEB;
    border-radius: 12px;
    padding: 11px 18px;
}
.conten-audit-ui-pop-cont .common-btn-new{
  
padding: 7px 10px;
  
font-size: 12px !important;
  
border-radius: 7px !important;
  
margin-top: 10px;
}
.key-words-box{
    padding-top: 30px;
    border-top: 2px dashed #E6E6E6;
    margin-top: 20px;
}
.key-words-box .key-head{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.key-words-box .key-head h5{
    font-size: 13px;
    color: #393643;
    margin: 0;
}
.key-words-box .key-head h5 svg{
    width: 16px;
    color: #C4C4C4;
    display: none;
}
.key-words-box .key-words{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 15px;
}
.key-words-box .key-words a{
    font-size: 12px;
    color: #393643;
    border: 1px solid #EBEBEB;
    border-radius: 6px;
    padding: 5px 10px;
}
.key-words-box .key-words a.current{
  border: 1px solid #B91D17;
  background: linear-gradient(88deg, #FFCDCE, #fff);
}
.key-words-box .key-words a.recomended{
  background: linear-gradient(88deg, #FFCDCE, #fff);
}
.key-words-input{
  display: flex;
    align-items: center;
    gap: 10px;
}

.key-words-input .form-check{
  display: flex;
    align-items: center;
    gap: 10px;
}

.key-words-input .form-check label{
  font-size: 12px;
  color: #646464;
  font-weight: 400;
}

.key-words-input .key-identity{

width: 20px;

height: 17px;

background: #000;

border-radius: 6px;

border: 1px solid #B91D17;

background: linear-gradient(88deg, #FFCDCE, #fff);
}
.key-words-input .key-identity.recom{
  background: linear-gradient(88deg, #FFCDCE, #fff);
  border: 1px solid #ccc;
}
.cus-chart-heading{
display: flex;
    align-items: center;
    justify-content: space-between;
}
.cus-chart-heading h1 {
  font-size: 20px;
  color: #6d6d6d;
  font-weight: 600;
  margin: 0;
  /* text-transform: capitalize; */
}
.cus-mlt-sel-mar{width: 170px;display: inline-flex;/* margin: 0 15px; */border: 0 !important;}
.cus-mlt-sel-mar .p-multiselect{
  border: 0 !important;
  border-bottom: 1px solid #EBEBEB !important;
  border-radius: 0 !important;
}
.p-multiselect-filter-container .p-inputtext{
  margin: 0;
}
.pop-close {
  background: #fff;
  border-radius: 100%;
  width: 25px;
  height: 25px;
  align-items: center;
  display: flex;
  justify-content: center;
  cursor: pointer;
  position: absolute;
  right: -18px;
  top: -18px;
}
.pop-close svg{
width: 15px;
}


.flatpickr-calendar {
  background: #f9f9ff;
  border: 2px solid #4F46E5;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}
.flatpickr-day.selected {
  background: #4F46E5;
  color: #fff;
  border-radius: 50%;
}

.tab-rep{
  border-radius: 8px;
  color: #fff;
  display: inline-block;
  padding: 2px 5px;
  min-width: 60px;
  font-size: 12px;
}
.tab-rep svg{
  
width: 17px;
}



.pop-sinle-linr-td .table {
  width: 100% !important;
  table-layout: fixed; /* required for text-overflow: ellipsis */
}

.pop-sinle-linr-td .table td,
.pop-sinle-linr-td .table th {
  white-space: nowrap;       /* single line only */
  overflow: hidden;          /* hide extra text */
  text-overflow: ellipsis;   /* show "..." when overflow */
}

/* Optional: column width control */
.pop-sinle-linr-td .table th:nth-child(1),
.pop-sinle-linr-td .table td:nth-child(1) {
  width: calc(100% - 205px);
}

.pop-sinle-linr-td .table th:nth-child(2),
.pop-sinle-linr-td .table td:nth-child(2) {
  width: 80px;
}

.pop-sinle-linr-td .table th:nth-child(3),
.pop-sinle-linr-td .table td:nth-child(3) {
  width: 125px;
}


.conten-audit-ui-pop-cont-box .right-cont-box .main-table .table-responsive{
  max-height: 450px;
  height: auto;
}

.count-img-box {
  display: flex;
  flex-wrap: wrap;  
  gap: 20px;
}

.count-img-box .img-box {
  width: calc(25% - 8px);
  padding: 15px;
  border: 1px solid #EBEBEB;
  border-radius: 12px;
  box-sizing: border-box;
  height: 140px;
}

.count-img-box .img-box img {
  width: 100%;
  display: block;
}
.video-box{}
.video-box video{}
.nes-table-row{
  width: 16px;
  margin-right: 10px;
}
.org-posi-box{
    display: flex;
    gap: 10px;
    align-items: center;
}
.org-posi{
    width: 165px;
    display: flex;
    flex-wrap: wrap;
}
.org-posi span{
    width: 33.3%;
    font-size: 12px !important;
    color: var( --new-primary-color);
    font-weight: 600 !important;
}
.org-posi span.head-clr{
  color: #bdbdbd !important;
  font-weight: 400 !important;
}
.collapse .nes-table-row{
visibility: hidden;
}
.flatpickr-months {
  padding: 15px 0 !important;
  margin: 0 10px !important;
  border-bottom: 1px solid #f2f2f2 !important;
}
.acc-pro-nme{
 
color: var( --new-primary-color);
}
.accordion-row td{
background: #F8F7FC !important;
}
.flatpickr-current-month .flatpickr-monthDropdown-months {
  font-size: 12px !important;
  color: #636363 !important;
  font-weight: 500 !important;
  border-color: transparent !important;
}

.flatpickr-current-month input.cur-year {
  font-size: 12px !important;
  color: #636363 !important;
  font-weight: 500 !important;
}

.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
  top: 14px !important;
}

.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg {
  width: 10px !important;
  height: 10px !important;
  fill: #636363 !important;
}

.flatpickr-weekdays {
  height: 50px !important;
}
.flatpickr-current-month .flatpickr-monthDropdown-months:hover{
  background: transparent !important;
  border: 0 Im !important;
}

.numInputWrapper:hover{
  background: transparent !important;
}

.time-column .flatpickr-calendar.open, time-column .flatpickr-calendar.inline{

  width: 130px !important;
}
.flatpickr-time input:hover, .flatpickr-time .flatpickr-am-pm:hover, .flatpickr-time input:focus, .flatpickr-time .flatpickr-am-pm:focus{
  background:#fff !important;
  border: 0 !important;
}
.cus-date{
    position: relative;
    z-index: 99;
}
.cus-date input{
  color: #b5b5b5 !important;
  font-weight: 400;
  padding-left: 10px !important;
}
.cus-date svg{
    position: absolute;
    top: 5px;
    right: 10px;
    width: 14px;
    color: #7D8398;
    z-index: 9;
}
.cus-date .form-control{
  
padding: 0;
  
border: 1px solid #ccc !important;
}
.cus-date .form-control input{
  border: 0 !important
}

.data-source-box{
  display: flex;
  gap: 25px;
}
.data-source-box label{
  color:#b5b5b5;
  font-weight: 400;
}
 
.no-submenu{
  padding-left: 30px;
}


.inner-page-tab-navigation {}

.inner-page-tab-navigation ul {
  display: flex;
  list-style: none;
  padding: 0;
  gap: 20px;
  margin: 0;
  border-bottom: 1px solid #cacaca !important;
  padding-bottom: 5px;
}


.inner-page-tab-navigation ul {
  display: flex;
    gap: 10px;
    border-bottom: 1px solid #d2d2d2;
    padding-bottom: 10px;
}
.inner-page-tab-navigation ul li {}

.inner-page-tab-navigation ul li a {border-radius: 0 !important;padding: 0 20px 5px 20px;color: #393643 !important;height: 100%;font-size: 14px;font-family: "Inter", sans-serif;background: #fff !important;border: 0 !important;font-weight: 400;position: relative;top: 1px;}
.inner-page-navigation ul{
  display: flex;
  gap: 15px;
  border-bottom: 1px solid #ccc;
  padding-bottom: 10px;
}
.inner-page-navigation ul li a.active,
.inner-page-navigation ul li a:hover {color: #252B37;border-bottom: 4px solid var( --new-primary-color) !important;margin-bottom: -2px;z-index: 99;font-weight: 600;border: 0;padding-bottom: 10px;}
.td-donet-box{
  background: #fff;
  border: 1px solid #BFBCFF;
  padding: 5px;
  border-radius: 25px;
  display: inline-flex;
  gap: 10px;
  align-items: center;
  min-width: 70px;
}

.td-donet-box app-donut-chart{
  width: 20px;
  height: 20px;
}
.td-donet-box span{
  font-size: 12px;
    color: #121212;

    font-weight: 600;
}

.left-cont-box-list{margin-top: 15px;}
.left-cont-box-list .head{
    display: flex;
    align-items: center;
    gap: 10px;
}
.left-cont-box-list .head span{
    width: 30px;
    height: 30px;
    border-radius: 100%;
    border: 1px solid #E1E1E1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.left-cont-box-list .head span img{
    width: 14px;
}
.left-cont-box-list .head h1{
    color: #393643 !important;
}
.left-cont-box-list ul{
    width: 100%;
    padding-left: 40px !important;
    height: auto !important;
    margin-bottom: 30px !important;
}


.custom-select {
  appearance: none;         /* Removes default OS/browser styling */
  -webkit-appearance: none; /* For Safari/Chrome */
  -moz-appearance: none;    /* For Firefox */
  padding-right: 2rem;  /* Control spacing for the arrow */
  border: 1px solid #ccc;  /* Border of the select */
  border-radius: 6px;
  background: #fff url("data:image/svg+xml;utf8,<svg fill='%23333' height='20' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M5 7l5 5 5-5'/></svg>") no-repeat right 0.7rem center; 
  background-size: 1rem;
}

/* Style the dropdown options */
.custom-select option {
  background: #fff;
  color: #333;
  padding: 6px 12px;
}

/* Optional: style the opened dropdown (for modern browsers) */
.custom-select:focus {
  border-color: #4F46E5; /* Highlight on focus */
  outline: none;
}

.trend-map{}
.trend-map select{
    height: 36px;
    padding: 0 20px 0 8px;
    color: #b5b5b5 !important;
    font-weight: 400;
    font-size: 13px;
    background-position: right 4px center;
    width: 105px;
}
.list-content-box{
    padding: 0 20px 20px;
    border: 1px solid #EBEBEB;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 20px;
}
.list-content-box-head{
    margin: 0 -20px;
    padding: 15px 20px;
    background: #F8F7FC;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}
.list-content-box-head h1{
  font-size: 14px;
  margin: 0;
}
.opti-box-cont{
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 20px;
}


.cus-opti-cont-box{
  padding: 20px;
  background:#F8F7FC;
  border-radius: 16px;
}
.cus-opti-cont-box select{
  font-size: 12px !important;
  font-weight: 400;
  border: 1px solid #EBEBEB !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  width: 100%;
  color: #b5b5b5;
}
.puplish-btn-box{
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 15px;
    justify-content: space-between;
    align-items: center;
}
.puplish-btn-box .cont{
    display: flex;
    align-items: center;
    gap: 10px;
}
.puplish-btn-box .cont span{}
.puplish-btn-box .cont span svg{
stroke: #27BFBF;
width: 18px;}
.puplish-btn-box .cont p{background: linear-gradient(272deg, #27BFBF, var( --new-primary-color));-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text; /* For Firefox */font-weight: 500;font-style: italic;}

.puplish-btn{
    display: flex;
    align-items: center;
    gap: 10px;
}

.pim-menu-img{
  max-width: 20px;
  min-width: 20px;
}

.top-input {}
.top-input .form-control{border: 0 !important;}


.top-input input {
  padding: 0 !important;
  width: 100%;
  background: transparent;
  border-radius: 0 !important;
  line-height: 37px;
  height: 37px !important;
  font-size: 13px !important;
  color: #393643 !important;
  border: 0 !important;
  border-bottom: 1px solid #afafaf !important;
  /* font-weight: 500 !important; */
}

.top-input select {
  padding: 0;
  width: 100%;
  background: transparent;
  border-radius: 0;
  line-height: 37px;
  height: 37px;
  font-size: 13px;
  /* color: #a5a5a5; */
  border: 0;
  border-bottom: 1px solid #afafaf;
  font-size: 13px;
}



.cus-box {
  height: 100%;
  box-shadow: 1px 1px 3px #00000026;
  background: #fff !important;
  padding: 15px;
  border-radius: 6px;
}

.cus-box h1 {
  width: 100%;
  font-size: 14px;
  color: var( --new-primary-color);
  margin-bottom: 0;
}

.das-fil-icon {
  color: var( --new-primary-color);
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 0;
}

.cus-box select {

border-bottom: 1px solid #ccc;

border-radius: 6px;

font-size: 12px;

color: #393643;

padding: 3px;

border-radius: 0;
}

.cus-box img {
  width: auto;
  margin: 0 auto;
}

.top-search-share{
    display: flex;
    align-items: center;
    justify-content: center;
}
.top-search-share i{
    color: var( --new-primary-color);
    cursor: pointer;
    font-size: 18px;
}
.chart-wrapper{
  margin-top: 20px;
}
.login-box{
    display: flex;
    height: 100vh;
}
.login-box .login-left{
    height: 100%;
    width: 50%;
    background: linear-gradient(307deg, var( --new-primary-color), #9D55CE);
    padding: 50px 50px 0 50px;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}
.login-box .login-right{
    width: 50%;
    padding: 50px 100px 50px 50px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: auto;
    gap: 25px;
}

.login-box .login-left .logo-in-logo{display: flex;flex-direction: column;gap: 30px;}
.login-box .login-left .logo-in-logo img{
    width: 225px;
    margin: inherit;
}
.login-box .login-left .logo-in-logo h1{
    color: #fff;
    font-weight: 400;
    margin: 0;
}
.login-box .login-left img{
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
}
.login-box .login-right h1{
    font-size: 40px;
    color: #2e2929;
}
.login-box .login-right p{
    margin: 0;
    font-size: 14px;
    color: #4a4a4a;
}
.login-box .login-right p.error{
    font-size: 13px;
    background: #ffdfdf;
    padding: 3px 6px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    color: #ff0000;
    font-weight: 500;
}
.login-box .login-right p.error svg{
  width: 16px;
}
.login-box .login-right .login-inputs label{
    font-size: 16px;
    color: #2e2929;
    margin-bottom: 5px;
}
.login-box .login-right .login-inputs .input-bx{
    position: relative;
    display: flex;
    align-items: center;
}
.login-box .login-right .login-inputs .input-bx input{
    width: 100%;
    height: 40px;
    line-height: 40px;
    border: 1px solid #EBEBEB;
    border-radius: 9px;
    padding: 0 40px;
}

.login-box .login-right .login-inputs .input-bx span{
  position: absolute;
  top: 9px;
  left: 10px;
}
.login-box .login-right .login-inputs .input-bx span svg{
    color: #dbdbdb;
    width: 18px;
}
  .login-box .login-right .login-inputs .input-bx span.pass-eye{
    
right: 10px;
    
left: auto;
}
.login-rempember-box{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.login-rempember{
    display: flex;
    align-items: center;
    gap: 10px;
}
.login-rempember input{}
.login-rempember p{}
.login-rempember-box a{}
.pass-conf-box{
    background: #f7f7f7;
    border-radius: 9px;
    padding: 10px 10px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.pass-conf-box p{
    font-size: 12px !important;
    color: #000 !important;
    display: flex;
    align-items: center;
    gap: 7px;
}
.pass-conf-box p svg{
    width: 15px;
}
.pass-conf-box p.true{
    color: green !important;
    font-weight: 500;
}
.pass-conf-box p.true svg{}
.log-mail-box{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}
.log-mail-box span{
    background: linear-gradient(104deg, #2b265f, #9a54cb);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 100px;
    border-radius: 100%;
}
.log-mail-box span svg{
    color: #fff;
    width: 45px;
    height: 45px;
}
.log-mail-box h1{
    font-size: 35px !important;
}
.log-mail-box p{
    text-align: center;
    line-height: 25px;
    font-size: 16px !important;
}

.link-expired span{
background: #ffdfdf;
}
.link-expired span svg{
  color: #d71414;
}
.product-small-img {
  max-width: 30px;
  /* float: left; */
  width: auto;
  max-height: 30px;

}

td:has(> .product-small-img) {
  text-align: center !important;
}
.product-enable-services{
    display: flex;
    gap: 10px;
}
.product-enable-services li{}
.product-enable-services li.disable{
  opacity: .5;
}
.product-enable-services li svg{
    width: 18px;
    color: var( --new-primary-color);
}


.import-box{
  
width: 470px;
  
margin: 0 auto;
  
max-width: 100%;
  
padding: 20px;
  
border: 1px solid #E6E6E6;
  
border-radius: 10px;
  
padding-top: 0;
  
overflow: hidden;
}
.import-box h1{
    margin: 0 -20px;
    padding: 10px 10px;
    font-size: 16px;
    background: #F8F7FC;
    margin-bottom: 15px;
}
.import-box p{
    font-size: 13px;
    margin-bottom: 0;
}
.drop-container-new {
  position: relative;
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 20px;
  border-radius: 10px;
  border: 2px dashed #9792FF;
  color: #444;
  cursor: pointer;
  transition: background .2s ease-in-out, border .2s ease-in-out;
  width: 100%;
  margin: 0 auto;
  background: #9792FF1A;
  /* box-shadow: 1px 1px 4px var( --new-primary-color)73; */
  justify-content: center;
  margin: 15px 0;
}

.drop-container-new img{
  
width: 40px;
}

.drop-container-new a {
  font-size: 28px;
  position: absolute;
  top: 5px;
  right: 5px;
  color: #00ee00;
}

.drop-container-new:hover {
  /* box-shadow: 1px 1px 9px #00000029; */
}

.drop-container-new:hover .drop-title {
  color: #222;
}

.drop-title {
  color: #444;
  font-size: 18px !important;
  transition: color .2s ease-in-out;
  margin-bottom: 5px !important;
  font-weight: 400;
}

span.browse {
  display: flex;
  justify-content: center;
  font-size: 15px;
}

span.browse span {
  display: flex;
  flex-direction: column;
  position: relative;
  justify-content: center;
  margin: 0;
}

span.browse span span {
  /* position: relative; */
  /* top: -28px; */
  left: 6px;
  z-index: 9;
}


input[type=file] {
  width: 171px;
  max-width: 100%;
  color: #444;
  /* padding: 5px; */
  background: #fff;
  border-radius: 10px;
  border: 1px solid #555;
  opacity: 0;
  height: 30px;
  z-index: 99;
  position: absolute;
}



.drop-container {
  position: relative;
  display: flex;
  gap: 10px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 20px;
  border-radius: 10px;
  border: 2px dashed #9a9a9a;
  color: #444;
  cursor: pointer;
  transition: background .2s ease-in-out, border .2s ease-in-out;
  width: 500px;
  margin: 0 auto;
  background: #f4f4f4b3;
  /* box-shadow: 1px 1px 4px var( --new-primary-color)73; */
}

.drop-container a {
  font-size: 28px;
  position: absolute;
  top: 5px;
  right: 5px;
  color: #00ee00;
}

.drop-container:hover {
  /* box-shadow: 1px 1px 9px #00000029; */
}

.drop-container:hover .drop-title {
  color: #222;
}


.scheduler-import {
  width: 100% !important;
}

.scheduler-import .drop-title {
  font-size: 16px !important;
}

.scheduler-import span.browse span {
  font-size: 13px;
}

input[type=file]::file-selector-button {
  margin-right: 20px;
  border: none;
  background: var( --new-primary-color);

  border-radius: 10px;
  color: #fff;
  cursor: pointer;
  transition: background .2s ease-in-out;
}

input[type=file]::file-selector-button:hover {
  background: #245c9f;
}
.table-import-icon{
  cursor: pointer;
}
.table-import-icon svg{
  width: 18px;
  color: var( --new-primary-color);
}


.ai-icon-btn-in{
  display: flex;
  align-items: center;
  position: relative;
  white-space: nowrap;
  z-index: 99;
}
.ai-icon-btn-in img{
  height: 15px;
    margin-right: 7px;
}
.cus-prog{
  position: relative;
  overflow:hidden;
}
.cus-btn-pogress{
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: var( --new-primary-nav-bar-color);
  display: none;
}
.cus-prog .cus-btn-pogress{
  display: block;
}
.cus-tool-cont{
  position:relative
}
.cus-tool-cont a{
      position: absolute;
    top: -18px;
    right: -10px;
}
.cus-tool-cont a i{
  font-size: 12px;
}

.cus-table-star-rating{
    display: flex;
    gap: 10px;
}
.cus-table-star-rating span{
    align-items: center;
    justify-content: space-between;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.cus-table-star-rating span img{
    width: 15px;
}
.cus-table-star-rating span h4{
    font-size: 12px;
    text-decoration: underline;
    color: var( --new-primary-color);
    font-weight: 500;
}
.cus-table-star-rating span h5{
  font-size: 12px;
}
.cus-table-star-rating span.empty{}
.cus-table-star-rating span.empty img{}
.ai-head{
  background:  var( --new-primary-color);
}
.ai-head h1{color: #fff !important;}
.ai-head svg{color: #fff;}
.ai-content-box{
    display: flex;
    gap: 12px;
    height: calc(100vh - 145px);
}
.ai-content-box .left{
    background: #fbf8ff;
    width: 30%;
    padding: 15px;
}
.ai-content-box .left h1{
    font-size: 16px;
}
.ai-content-box .left ul{
    display: flex;
    flex-direction: column;
    gap: 5px;
  
}
.ai-content-box .left ul li{}
.ai-content-box .left ul li a{
    display: inline-block;
    color: #7a7a7a;
    font-size: 13px;
    display: -webkit-box;
    -webkit-line-clamp: 1;      /* Number of lines to show */
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 10px 0;
}
.ai-content-box .right{
    width: 70%;
    padding: 5px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    position: relative;
}
.ai-content-box .right h1{
    font-size: 13px;
    margin-left: 75px;
    background: #f4ebff;
    padding: 10px 15px;
    border-radius: 20px 20px 20px 0;
}
.ai-content-box .right .ai-ans{
    border: 1px solid #ccc;
    border-radius: 9px;
    padding: 15px;
    margin-right: 75px;
}
.ai-content-box .right .ai-ans p{
    margin: 0;
    font-size: 13px;
    color: #707070;
}
.ai-content-box .right .ai-input-box{
    position: relative;
}
.ai-content-box .right .ai-input-box textarea{
    width: 100%;
    border: 1px solid var( --new-primary-color);
    border-radius: 9px;
    padding: 10px;
    font-size: 13px;
}
.ai-content-box .right .ai-input-box button{
    position: absolute;
    bottom: 20px;
    right: 9px;
    background: var( --new-primary-color);
    border-radius: 100%;
    width: 30px;
    height: 30px;
}
.ai-content-box .right .ai-input-box button svg{
    color: #fff;
    width: 14px;
}

.ai-hi-msg{
    margin-top: 100px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 15px;
}
.ai-hi-msg span{
    background: linear-gradient(104deg, #2b265f, #9a54cb);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    border-radius: 100%;
}
.ai-hi-msg span img{
    width: 35px;
}
.ai-hi-msg h3{
    color: #383838;
}
.ai-hi-msg h4{
    font-size: 13px;
    font-weight: 400;
    text-align: center;
    color: #717171;
}
.arrow-rotate svg{
  transform: rotate(180deg);
}
.cus-btn{
    background: transparent;
    color: var( --new-primary-color);
}

.cus-btn svg{
  color:var( --new-primary-color);
}

.optimize-drop{
  position: relative;
}
.optimize-drop button{}
.optimize-drop .drop-dowm-box{
  position: absolute;
  z-index: 9999;
  background: #ffffff;
  width: max-content;
  padding: 10px;
  right: 0;
  border-radius: 6px;
  top: 40px;
  box-shadow: 0px 0px 8px #00000036;
}
.optimize-drop .drop-dowm-box ul{
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.optimize-drop .drop-dowm-box ul li{font-size: 13px;color: #605f5f;display: flex;gap: 10px;align-items: flex-start;border-bottom: 1px solid #ececec;padding: 10px 0;}
.optimize-drop .drop-dowm-box ul li input[type="checkbox"]{
  margin-top: 4px;
}
.optimize-drop .drop-dowm-box .drp-btn{
  /* margin: 0 -10px; */
  margin-top: 10px;
  /* background: #000; */
  display: flex;
  justify-content: right;
  gap:5px
}
.optimize-drop .drop-dowm-box .drp-btn button{
padding: 2px 6px !important;
  font-size: 12px !important;
}
.optimize-drop .drop-dowm-box .drp-btn button.cn{}
.optimize-drop .drop-dowm-box .drp-btn button.ap{
  
}

.chat-box {
  position: fixed;
  width: 70%;
  right: 0;
  height: calc(100vh - 70px);
  background: #ffffff;
  border-radius: 12px;
  display: none;
  box-shadow: -2px -2px 9px #00000052;
  z-index: 9999999;
  overflow: hidden;
  margin: 0 auto;
  left: 0;
  top: 35px;
}
.right-cont-box-ai{
  
display: flex;
  
flex-direction: column;
  
gap: 15px;
  
height: 100%;
  
overflow: auto;
  
padding: 10px;
}
.key-bor-rit{
 
}
.margin .p-multiselect{
  margin: 0 !important;
 
}

.cus-height-sel .p-multiselect{
  margin: 0 !important;
  height: 45px !important;
}

.cus-height-sel input{
  height: 45px !important;
}
.cus-height-sel svg{
    width: 15px;
    top: 10px;
}

.inner-table-1st-column-border-none tbody th:nth-child(1),
.inner-table-1st-column-border-none tbody td:nth-child(1) {
  border-right: none !important;
}
.inner-table-1st-column-border-none tbody th:nth-child(2),
.inner-table-1st-column-border-none tbody td:nth-child(2){
  border-left: none !important;
}


.alert-page{}
.alert-page .heading{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 25px 0;
}
.alert-page .heading h1{
    font-size: 15px;
    color: var( --new-primary-color);
}
.alert-page .heading a{
    font-size: 12px;
    font-weight: 600;
}
.das-alert-box{
    padding: 10px;
    border: 1px solid #ebebeb;
    border-radius: 9px;
    margin-bottom: 20px;
}
.das-alert-box .heading{
    justify-content: normal;
    display: flex;
    align-items: center;
    gap: 30px;
    margin: 0;
    margin-bottom: 15px;
}
.das-alert-box .heading h1{
    font-size: 13px;
}
.das-alert-box .heading .cat{
    display: flex;
    align-items: center;
    gap: 7px;
}
.das-alert-box .heading .cat span{
    width: 7px;
    height: 7px;
    display: flex;
    border-radius: 100%;
}
.das-alert-box .heading .cat h2{
    font-size: 12px;
}
.das-alert-box .heading .cat h3{
    font-size: 12px;
}
.das-alert-box .heading .cat.high{}
.das-alert-box .heading .cat.high span{
    background: #ff0909;
}
.das-alert-box .heading .cat.medium{}
.das-alert-box .heading .cat.medium span{
    background: #fdcf20;
}
.das-alert-box .heading .cat.low{}
.das-alert-box .heading .cat.low span{
    background: green;
}
.das-alert-div{
    width: 33%;
    padding: 10px;
    border-radius: 6px;
    border: 1px solid;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.das-alert-div .hea{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0;
}
.das-alert-div .hea h4{
    font-size: 12px;
}
.das-alert-div .hea span{
    font-size: 10px;
    color: #898989;
}
.das-alert-div .hea span svg{
    color: #898989;
    width: 12px;
    height: 12px;
}
.das-alert-div p{
    font-size: 13px;
    color: #787878;
    margin: 0;
}
.das-alert-div .alert-button-box{
    display: flex;
    align-items: center;
    gap: 11px;
}
.das-alert-div .alert-button-box button{
    font-size: 12px;
    padding: 5px 10px;
    border-radius: 6px;
    border: 1px solid;
    display: flex;
    align-items: center;
    gap: 7px;
    font-weight: 500;
}
.das-alert-div .alert-button-box button svg{
    width: 13px;
}
.das-alert-div .alert-button-box button.com{
    background: var( --new-primary-color);
    color: #fff;
    border-color: var( --new-primary-color);
}
.das-alert-div .alert-button-box button.out{border-color: #ebebeb;}
.das-alert-div-high{
    border-color: #ff0909;
    background: #ff090912;
}
.das-alert-div-low{
    border-color: #008000;
    background: #00800012;
}
.das-alert-div-medium{
    border-color: #fdcf20;
    background: #fdcf2012;
}
.alert-right-pannel-nav{}
.alert-right-pannel-nav ul{
    border-top: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb;
    padding: 10px 20px;
    display: flex;
}
.alert-right-pannel-nav ul li{}
.alert-right-pannel-nav ul li a{
    font-size: 13px;
    padding: 0px 20px;
    color: #8e8e8e;
    padding-bottom: 11px;
}
.alert-right-pannel-nav ul li a.active, .alert-right-pannel-nav ul li a:hover{
    color: var( --new-primary-color);
    font-weight: 600;
    border-bottom: 4px solid var( --new-primary-color);
    
}
.right-pannel-das-alert-div{
    padding: 20px;
}
.right-pannel-das-alert-div .das-alert-div{
    width: 100%;
    margin-bottom: 20px;
}

.cus-check-box-mt{
  display: flex !important;
  gap: 10px;
  align-items: center;
}
body .p-multiselect-panel .p-multiselect-items .p-multiselect-item div > div, body .p-dropdown-panel .p-dropdown-items .p-dropdown-item div > div{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}





/********* Colors **********/
.clr-red {
  color: #FF6464 !important;
}
.clr-green {
  color: #30B56C !important;
}
.clr-orange {
  color: #F79009 !important;
}
.clr-blue {
  color: var( --new-primary-color) !important;
}
.clr-purple {
  color: #B45ADB !important;
}

.bg-green-light {
  background: #a1ffcc !important;
}
.bg-red-light {
  background: #FF64641A !important;
}
.bg-blue-light {
  background: #E0ECFF !important;
}
.bg-purple-light {
  background: #F4DAFF !important;
}

.li-bg-green{
  background: #04B68D !important;
}
.li-bg-blue{
  background: #2970FF !important;
}
.li-bg-orange{
  background: #FEF0C7 !important;
}
.li-bg-gray{
  background: #E9EAEB !important;
}


.cus-bg-1{
  background: #D1E0FF !important;
  color: #2970FF !important;
}
.cus-bg-2{
  background: #DCFAE6 !important;
  color: #079455 !important;
}
.cus-bg-3{
  background: #F2E0FF !important;
  color: #891CDE !important;
}
.cus-bg-4{
  background: #FEF0C7 !important;
  color: #93370D !important;
}
.cus-bg-5{
  background: #FEE4E2 !important;
  color: #7A271A !important;
}
.cus-bg-6{
  background: #FFE0F6 !important;
  color: #DE1C89 !important;
}
.cus-bg-7{
  background: #E9EAEB !important;
  color: #252B37 !important;
}
.cus-bg-8{
  background: #DCF9FA !important;
  color: #077A94 !important;
}
.cus-bg-9{
  background: #FFF1E0 !important;
  color: #DE701C !important;
}
.cus-bg-10{
  background: #DCEBFA !important;
  color: #076794 !important;
}