/*=============================
          Global css
=============================*/

a:focus {
  outline: none;
}

.dominate-loader {
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  /* background: linear-gradient(306deg, #502eff 0%, #d1c7ff 100%) !important; */
  background: $theme-bg-color-overlay;
  opacity: 1;
  position: absolute;
  z-index: 999999;
  transition: 0.3s ease-out opacity;
}

/*=========================
      Employees popup css 
  ===========================*/

.skylight-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99;
  /* background-color: rgba(0, 0, 0, 0.3); */
  transition-property: all;
  transition-timing-function: ease;
  display: block;
  transition-duration: 2000ms;
  background: $theme-bg-color-overlay !important;
}

.skylight-close-button {
  z-index: 9999;
}

/*================================================
      add lead already assign employee on click
  ==================================================*/
.active-assign-employee {
  @include fontBold700;
  // color:burlywood
  color: $color-white;
}

/*=======================
      React s alerts
  ========================*/
.s-alert-box {
  background: $theme-bg-blue-1 !important;
  border-radius: vw(10px) !important;
  @include fontSemiBold600Important;
  z-index: 999999999999999999 !important;
}

/*=======================================
            Background colors
  ========================================*/
.CircularProgressbar {
  width: 60% !important;
  vertical-align: middle;
}

/*========================================
        Pagination
  ==========================================*/
.rc-pagination {
  display: flex;
  justify-content: center;
}

.rc-pagination-item {
  @include theme-mixin-2-important;
}

.rc-pagination-item-active {
  color: $theme-text-color-white-79 !important;
  background: rgba(111, 90, 220, 0.13) !important;
  border: vw(1px) solid $theme-text-color-blue !important;
  backdrop-filter: blur(56px) !important;
  border-radius: vw(8px) !important;
}

.rc-pagination > li:focus {
  outline: none;
}

.rc-pagination > li:hover {
  border-color: #6266e1;
}

.fa-trash:hover {
  cursor: pointer;
}

.overview-display-none {
  display: none;
}

.weekdays_color {
  background-color: gray;
}

.gantt .today-highlight {
  fill: burlywood !important;
}

/* drag and drop css */

.smooth-dnd-container.vertical > .smooth-dnd-draggable-wrapper {
  overflow: unset !important;
  display: block;
}

.box_main {
  text-align: left;
  width: 100%;
  height: 50px;
  background-color: pink;
  margin-bottom: 20px;
}

/* ======================================
        Craftjs css (proposals)
  =========================================*/

.w-full {
  width: 100%;
}

.gBIvbx svg {
  width: 22px;
  height: 22px;
  fill: #fff !important;
}

.hUSxDH svg {
  width: 8px;
  height: 8px;
}

.flex {
  display: flex;
}

.h-full {
  height: 100%;
}
.flex-col {
  flex-direction: column;
}

.w-4 {
  width: 1rem;
}

.mr-2 {
  margin-right: 1.5rem;
}

.h-4 {
  height: 1rem;
}

.items-center {
  align-items: center;
}

.border-b {
  border-bottom-width: 1px;
}

.bg-white {
  --bg-opacity: 1;

  background-color: rgba(255, 255, 255, var(--bg-opacity));
}

.flex-1 {
  flex: 1 1 0%;
}

.h-screen {
  height: 100vh;
}

.bg-light-gray-1 {
  --bg-opacity: 1;
  background-color: rgb(75, 75, 75);
  background-color: rgba(75, 75, 75, var(--bg-opacity));
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.justify-end {
  justify-content: flex-end;
}
.items-end {
  align-items: flex-end;
}

.mr-5 {
  margin-right: 1.25rem;
}

.text-xl {
  font-size: 1.5rem;
}

.cursor-pointer {
  cursor: pointer;
}

.pt-3 {
  padding-top: 0.75rem !important;
}

.pb-2 {
  padding-bottom: 0.5rem;
}
.m-2 {
  margin: 0.5rem;
}
.block {
  display: block;
}

.bg-white {
  --bg-opacity: 1;

  background-color: rgba(255, 255, 255, var(--bg-opacity));
}

.w-12 {
  width: 3rem;
}

.h-full {
  height: 100%;
}

.border-r {
  border-right-width: 1px;
}
.pt-3 {
  padding-top: 0.75rem;
}

.fixed {
  position: fixed;
}

.overflow-hidden {
  overflow: hidden;
}

.flex-row {
  flex-direction: row;
}

.pb-8 {
  padding-bottom: 2rem;
}
.overflow-auto {
  overflow: auto;
}

.bg-renderer-gray {
  --bg-opacity: 1;
  background-color: rgb(224, 224, 224);
  background-color: rgba(224, 224, 224, var(--bg-opacity));
}

.relative {
  position: relative;
}

.text-light-gray-2 {
  --text-opacity: 1;
  color: rgb(128, 128, 128);
  color: rgba(128, 128, 128, var(--text-opacity));
}
.pt-6 {
  padding-top: 1.5rem;
}
.text-xs {
  font-size: 1.5rem;
}
.justify-center {
  justify-content: center;
}

.pb-8 {
  padding-bottom: 2rem;
}
.w-2 {
  width: 0.5rem;
}
.px-2 {
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}
.py-2 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.border-b {
  border-bottom-width: 1px;
}

.component-selected::after {
  content: " ";
  --border-opacity: 1;
  border-color: #2680eb;
  border-color: rgba(38, 128, 235, var(--border-opacity));
  border-width: 1px;
  border-style: dashed;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  display: block;
}

.diwPXM svg {
  width: 8px;
  height: 8px;
}

.dQHKtE svg {
  width: 20px;
  height: 20px;
}

.cursor-move {
  cursor: move;
}

.component-selected::after {
  content: " ";
  --border-opacity: 1;
  border-color: #2680eb;
  border-color: rgba(38, 128, 235, var(--border-opacity));
  border-width: 1px;
  border-style: dashed;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  display: block;
}

.bg-green-400 {
  @include theme-blue-bg-btn;
}

.uppercase {
  text-transform: uppercase;
}

.dQHKtE,
h2 {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
}

.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.pb-1 {
  padding-bottom: 0.25rem;
}

.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.text-light-gray-1 {
  --text-opacity: 1;
  /* color: rgb(75, 75, 75); */
  color: rgba(75, 75, 75, var(--text-opacity));
}

.text-left {
  text-align: left;
}
.text-sm {
  font-size: 1.25rem;
}
.font-medium {
  font-weight: 500;
}

.text-light-gray-2 {
  --text-opacity: 1;
  /* color: rgb(128,128,128); */
  color: rgba(128, 128, 128, var(--text-opacity));
}
.text-right {
  text-align: right;
}

.layer-name {
  font-size: 15px;
  line-height: 26px;
  margin: 0;
}

.w-6 {
  width: 1.9rem;
}

// .shadow-md {
//   // box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0vw(2px)4px -1px rgb(0 0 0 / 6%);
// }

.rounded-full {
  border-radius: 9999px;
}
.bg-black {
  --bg-opacity: 1;
  /* background-color: #000; */
  background-color: rgba(0, 0, 0, var(--bg-opacity));
}

.flex-row-reverse {
  flex-direction: row-reverse;
}

.MuiAccordionSummary-content p {
  margin: 0;
}

.h-6 {
  height: 1.9rem;
}

.dQHKtE {
  svg {
    fill: #707070;
    width: 1.5rem;
    margin-right: 1rem;
    height: 1.5rem;
  }

  h2 {
    margin: 0;
  }
}

.iaFlUT img {
  width: 100%;
  height: auto;
}

.mr-4 {
  margin-right: 1rem;
}

.custom-h2-class {
  font-size: inherit;
  font-weight: inherit;
}

h2 {
  line-height: inherit !important;
}

.xKomK h2 {
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
}
