
@import url('https://fonts.googleapis.com/css2?family=DM+Mono:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&display=swap');


:root {
  --body-color: #E4E9F7;
  --sidenavbar-color: #fff;
  --purple-accent: #8617AA;
  --hover-bg: #f9f9fa;
  --black: #1c1c1c;
  --white-text: #FAFAFA;
  --selected-bg: #F4F4F5;
  --line-color: #E4E4E6;
  --line-color2: #E4E4E7;
  --subtext-grey-r-text: #71717A;
  
  --trans-02: all 0.2s ease;
  --trans-03: all 0.3s ease;
  --trans-04: all 0.4s ease;
  --trans-05: all 0.5s ease;
}

body {
  background-color: var(--body-color);
  height: 100vh;
  padding: 0;
  font-size: 14px;
  background-color: #FAFAFA;
}

* {
  /*font-family: Lato;*/
  font-family: "Geist-Regular";
}

*:focus-visible {
  outline: none;
  /* it is useful when not using mouse to see which element is on focus, but we don't support that as of now */
}

@font-face {
	font-family: 'Geist-Thin';
	src:url('/assets/fonts/Geist-Thin.otf')format("opentype")
}

@font-face {
	font-family: 'Geist-UltraLight';
	src:url('/assets/fonts/Geist-UltraLight.otf')format("opentype")
}

@font-face {
	font-family: 'Geist-Light';
	src:url('/assets/fonts/Geist-Light.otf')format("opentype");
}

@font-face {
	font-family: 'Geist-Regular';
	src:url('/assets/fonts/Geist-Regular.otf')format("opentype")
}

@font-face {
	font-family: 'Geist-Bold';
	src:url('/assets/fonts/Geist-Bold.otf')format("opentype")
}

@font-face {
	font-family: 'Geist-Medium';
	src:url('/assets/fonts/Geist-Medium.otf')format("opentype")
}


@font-face {
	font-family: 'Geist-Semibold';
	src:url('/assets/fonts/Geist-SemiBold.otf')format("opentype")
}

input[type=checkbox]:checked {
  background-color: var(--purple-accent, #8617AA);
  content: url('/assets/images/checkbox-check.svg');
  box-shadow: none;
}
input[type=checkbox] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 16px;
  height: 16px;
  border: 0.5px solid #E4E4E7;
  border-radius: 2px;
  background-color: #fff;
  box-shadow: -0.5px -0.5px 4.65px 0.5px #0000001A inset;
  padding: 2px;
  cursor: pointer;
  outline: none;
}
input[type=checkbox].checked-bg-black {
  background-color: var(--black);
}
input[type=checkbox]:focus {
  outline: none;
}


button.formSubmitButton:disabled
{
    background-color: black;
    opacity: 0.5;
    cursor: not-allowed;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: "Geist-Bold";
}

.heading-fw-800 h1, .heading-fw-800 h2, .heading-fw-800 h3, .heading-fw-800 h4, .heading-fw-800 h5, .heading-fw-800 h6,
.heading-fw-800 .h1, .heading-fw-800 .h2, .heading-fw-800 .h3, .heading-fw-800 .h4, .heading-fw-800 .h5, .heading-fw-800 .h6 {
  font-weight: 700 !important;
}

.heading-fw-bold h1, .heading-fw-bold h2, .heading-fw-bold h3, .heading-fw-bold h4, .heading-fw-bold h5, .heading-fw-bold h6,
.heading-fw-bold .h1, .heading-fw-bold .h2, .heading-fw-bold .h3, .heading-fw-bold .h4, .heading-fw-bold .h5, .heading-fw-bold .h6 {
  font-weight: bold !important;
}

.fw-extra-bold, .fw-800 {
  font-weight: 800 !important;
}

.fw-bold {
  font-weight: bold !important;
  font-family: 'Geist-Bold';
}

.fw-normal {
  font-weight: 500 !important;
}

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

input:after
{
    color: white;
}

/* .main_content {
  margin-left: 16px;
} */

.container-fluid {
  padding-left: 0;
  padding-right: 0;
}

.content-page {
  /* margin-left: 16px; */
  margin-top: 8px;
}

.b-0 {
  border: 0;
}

.br-0 {
  border-radius: 0px;
}

.loading_div_container {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 99;
  transform: translate(-50%, -50%);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.loading_div_container img {
  width: 60px;
  height: auto;
  animation: rotate 2s linear infinite;
}

@keyframes rotate {
  0% {
      transform: rotate(0deg);
  }
  100% {
      transform: rotate(360deg);
  }
}

#loading-bar .bar {
  background: var(--purple-accent);
}

#loading-bar .peg {
  -moz-box-shadow: var(--purple-accent) 1px 0 6px 1px;
  -ms-box-shadow: var(--purple-accent) 1px 0 6px 1px;
  -webkit-box-shadow: var(--purple-accent) 1px 0 6px 1px;
  box-shadow: var(--purple-accent) 1px 0 6px 1px;
}

#loading-bar-spinner .spinner-icon {
  border-top-color:  var(--purple-accent);
  border-left-color: var(--purple-accent);
}

.formSubmitButton
{
    border-radius: 5px;
    background-color: #e90258;
    height: 35.5PX;
    color: #ffffff;
    font-size: 14PX;
    font-weight: 400;
    text-align: center;
    line-height: 0px;
    border: transparent;
    justify-content: center; /* center horizontally */
    align-items: center;
    min-width: 100px;
}

.formCancelButton
{
    border-radius: 5px;
    height: 35.5PX;
    /* color: #ffffff; */
    font-size: 14PX;
    font-weight: 400;
    text-align: center;
    line-height: 0px;
    /* border: transparent; */
    justify-content: center; /* center horizontally */
    align-items: center;
    min-width: 100px;
}

.aco-table th, td {
  border-color: #96D4D4;
}


.formInputFields
{
    z-index: 1;
    border-radius: 2px;
    border-style: solid;
    border-width: 1px;
    border-color: #e7e9eb;
    background-color: #ffffff;
    width:80%;
    height: 36.5px;
    margin-bottom: 11px;
    /* font-family: Lato; */
    color: #919cab;
    font-size: 14px;
    font-weight: 400;
    transform: scaleX(1.0008);
    padding: 6px 12px;
}


.titleHeader
{
      font-family: Lato;
    color: #000000;
    font-size: 24px;
    font-weight: 700;
    line-height: 45px;
}

.subTitleHeader
{
      font-family: Lato;
    color: #999999;
    font-size: 16px;
    font-weight: 400;
}


.text_center
{
  text-align: center;
}


.vertically_center
{
    display: inline-block;
    vertical-align: middle;
    line-height: normal;
}

.divCenter
{
    padding: 10px;
    background-color: #BBDEFB;
    top: 50px;
    left: 200px;
    border-radius: 5px;
}

.showPassIcon
{
    position: absolute;
    right: 66px;
    top: 10px;
}

.errorMsg
{
    font-family: Lato;
    font-size: 16px;
    font-weight: 400;
    color: red;
    border-radius: 5px;
}

/* DayX new side nav bar */

hr {
  background-color: var(--line-color);
  height: 1px;
  border: 0;
}

.text-purple-accent {
  color: var(--purple-accent);
}

.sidenavbar * {
  box-sizing: border-box;
}

.main-container {
  display: flex;
}

.main-content {
  flex: 1;
  height: 100vh;
  overflow: auto;
}

#sidenavbar-container {
  display: flex;
  flex: 0 0 250px;
}

#sidenavbar-container.closed {
  flex: 0 0 74px;
}

.sidenavbar-container,
.sidenavbar {
  transition: var(--trans-05);
}

.sidenavbar {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 250px;
  /* padding: 19px 15px 15px 15px; */
  background-color: var(--sidenavbar-color);
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--line-color);
  /* transition: var(--trans-05); */
  z-index: 999;
}

.sidenavbar.closed {
  width: 74px;
}

.sidenavbar .text {
  font-size: 14px;
  font-weight: 500;
  transition: var(--trans-04);
  /* white-space: no-wrap; */
  opacity: 1;
}

.sidenavbar.closed .text {
  opacity: 0;
}

.sidenavbar header {
  border-bottom: 1px solid var(--line-color);
  padding: 19px 15px 0px 15px;
}

.sidenavbar header .logo-text {
  position: relative;
}

.sidenavbar header .button {
  width: 100%;
  margin: 10px 0px;
  padding: 6px 0px;
  border-radius: 5px;
  background-color: var(--black);
  color: var(--white-text);
  font-size: 16px;
  text-wrap: nowrap;
}

.sidenavbar.closed header .button {
  padding: 6px 0px;
}

.sidenavbar.closed header .button .icon svg {
  height: 20px;
  width: 20px;
}

.fade-in {
  transition: opacity 1s ease-in; /* Adjust the duration and timing function as needed */
}

.fade-in.ng-hide-add,
.fade-in.ng-hide-remove {
  display: block !important;
}

.fade-in.ng-hide {
  opacity: 0;
  transition-duration: 0s;
}

.sidenavbar .logo-text {
  display: flex;
  align-items: center;
}

.sidenavbar .logo-text img {
  height: 38px;
}

.sidenavbar .logo-text .logo-image img {
  width: 32px;
}

.sidenavbar .logo-text .logo-image .menu-icon {
  font-size: 36px;
}

.sidenavbar .logo-text .logo-image-text img {
  margin-left: 5px;
  height: 38px;
}

.sidenavbar .menu-svg-container {
  position: relative;
  height: 32px;
  width: 32px;
}

.sidenavbar .menu-svg-container svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  stroke: var(--black);
  transition: opacity 0.1s ease-in-out;
}

.sidenavbar .menu-svg-container .svg1 {
  opacity: 1;
}

.sidenavbar .menu-svg-container .svg2 {
  transform: rotate(180deg);
  opacity: 0;
}

.sidenavbar .menu-svg-container:hover .svg1 {
  opacity: 0;
}

.sidenavbar .menu-svg-container:hover .svg2 {
  opacity: 1;
}

.sidenavbar header .logo-text .toggle {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  height: 25px;
  width: 25px;
  font-size: 23px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sidenavbar .menu-bar {
  overflow-y: auto;
  overflow-x: hidden;
  height: calc(100% - 150px);
}

.sidenavbar .menu-bar::-webkit-scrollbar {
  /* width: 5px; */
  width: 0px; /* Don't show scrollbar */
}

.sidenavbar .menu-bar::-webkit-scrollbar-thumb {
  background: var(--line-color);
  border-radius: 10px;
}

.sidenavbar .menu-bar {
  visibility: hidden;
}

.sidenavbar .menu-bar .menu,
.sidenavbar .menu-bar:hover {
  visibility: visible;
}

.sidenavbar .menu-links {
  padding: 0px 10px;
  margin-bottom: .5rem;
  margin-top: .5rem;
}

.sidenavbar li {
  /* height: 36px; */
  margin-top: 8px;
  list-style: none;
}

.sidenavbar li .sub-links {
  transition: var(--trans-03);
}

.sidenavbar li .sub-links {
  margin-bottom: 10px;
  padding: 0px;
  display: none;
}

.sidenavbar li .sub-links li {
  margin-top: 6px;
}

.sidenavbar li.showMenu .sub-links {
  display: block;
}

/* .sidenavbar li.showMenu .drop-list .text {
  font-weight: bold;
} */

.sidenavbar li .active-link .text {
  font-weight: bold;
}

.sidenavbar li .sub-links .nav-item a {
  padding-left: 40px;
}

.sidenavbar.closed li .sub-links {
  display: none;
} 

.sidenavbar li .nav-item {
  height: 36px;
  position: relative;
}

.sidenavbar.closed li .nav-item.active-link a {
  background-color: var(--selected-bg);
}

.sidenavbar li .nav-item .i-dropdown {
  color: var(--black);
  position: absolute;
  font-size: 16px;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  transition: var(--trans-03);
  pointer-events: none;
}

.sidenavbar li .nav-item a * {
  pointer-events: none;
}

.sidenavbar li .nav-item a:hover {
  cursor: pointer;
}

.sidenavbar li .nav-item a .i-dropdown {
  opacity: 0;
}

.sidenavbar li .nav-item a:hover .i-dropdown {
  opacity: 1;
}

.sidenavbar li.showMenu .nav-item a .i-dropdown {
  opacity: 1;
  transform: translateY(-50%) rotate(-180deg);
}

.sidenavbar.closed li .nav-item a .i-dropdown,
.sidenavbar.closed li .nav-item a:hover .i-dropdown {
  opacity: 0;
}

.sidenavbar li .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  font-size: 20px;
}

.sidenavbar li .icon .icon-image {
  height: 20px;
  width: 20px;
}

.sidenavbar li .icon svg {
  height: 16px;
  width: 16px;
}

.sidenavbar li .icon i {
  font-size: 16px;
}

.sidenavbar li .icon svg path {
  stroke: var(--black);
}

.sidenavbar li .icon,
.sidenavbar li .text {
  color: var(--black);
}

.sidenavbar.closed li .text {
  display: none;
}

.sidenavbar li .nav-item a {
  height: 100%;
  width: 100%;
}

.sidenavbar li .text-purple-accent .icon,
.sidenavbar li .text-purple-accent .text {
  color: var(--purple-accent) !important;
}

.sidenavbar li .text-purple-accent .icon svg path {
  stroke: var(--purple-accent) !important;
}

.sidenavbar li .multi-links {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.sidenavbar li .multi-links a {
  font-size: 14px;
  color: var(--black);
}

.sidenavbar li a {
  padding: 0px 10px;
  display: flex;
  align-items: center;
  text-decoration: none;
  text-wrap: nowrap;
  border-radius: 5px;
  transition: var(--trans-03);
}

.sidenavbar.closed li a {
  justify-content: center;
}

.sidenavbar li a:hover {
  background: var(--hover-bg);
}

.sidenavbar .user-image-container {
  width: 35px; 
  height: 35px;
  overflow: hidden;
  border-radius: 50%;
}

.sidenavbar .user-image-container img {
  width: 100%;
  height: auto;
  display: block;
}


.sidenavbar footer {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.sidenavbar footer li {
  position: relative;
  margin: 0px;
  padding-top: 3px;
}

.sidenavbar footer li a {
  padding: 0px;
}

.sidenavbar footer li .icon {
  min-width: 54px;
}

.sidenavbar footer li .sub-links {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 100%;
  margin: 0px;
  padding: 0px;
  padding-bottom: 3px;
  border-top: 1px solid var(--line-color);
  background-color: var(--sidenavbar-color);
}

.sidenavbar footer li .sub-links .nav-item {
  margin: 0px 10px;
}

.sidenavbar footer li .sub-links .nav-item a {
  padding: 0px 10px;
}

.sidenavbar ul.footer-nav-items {
  padding: 0px;
  margin: 0px;
}

.sidenavbar footer .nav-item {
  height: 40px;
  margin: 0px 10px;
}

.sidenavbar footer .nav-item .i-dropdown {
  transform: translateY(-50%) rotate(-180deg);
  /* opacity: 1 !important; Uncomment if you wanna show the chevrons icon on user regardless of hover or not */
}

.sidenavbar footer li.showMenu .nav-item a .i-dropdown {
  opacity: 1;
  transform: translateY(-50%);
}

.sidenavbar.closed footer .nav-item .i-dropdown {
  opacity: 0 !important;
}

.sidenavbar footer li .icon {
  font-size: 30px;
}

/* DayX new side nav bar end */

.main-body {
  position: relative;
  left: var(--navbar-width, 0px);
  width: calc(100% - var(--navbar-width, 0px));
}

.main-body {
  position: relative;
  left: 250px;
  width: calc(100% - 250px);
  transition: var(--trans-05);
}

.main-body.sidenavbarclosed {
  left: 74px;
  width: calc(100% - 72px);
}


#sidebar
{
    text-align: -webkit-auto;
    min-height: -webkit-fill-available;
    height: 100%;
    width: auto;
    position: relative;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: cadetblue;
    overflow-x: hidden;
    transition: 0.5s;
    color: white;
}

#navigation > li
{
  list-style: none;
}

#navigation > li > a {
      padding: 5%;
    text-decoration: none;
    font-size: 18px;
    color: white;
    display: block;
    transition: 0.3s;
    height: auto;
}

#navigation > li > a:hover {
    color: green;
    width: 100%;
    box-shadow: 0 0 11px rgba(33,33,33,.2);
    background-color: white;
    cursor: pointer;
}

.h-navbar-offset {
  height: var(--navbar-height, 60px);
}

.navbar li {
  font-size: 15px;
}

.navbar .dropdown-item {
  font-size: 15px;
}

.dropdown-menu-mh-300px {
  overflow-y: auto;
  max-height: 300px;
}

.dashboardParentDiv
{
    width: inherit;
    height: auto;
    margin-top: 15px;
    display: contents;
}

/* .dashboardContentSection{
} */

.text_align_right
{
  text-align: right;
}


.text_align_center
{
  text-align: center;
}
.navbar-default
{
    background-color: cadetblue;
    border-color: white;
    color: white;
}

.bg-dayx-brand {
  background-color: rgb(26, 1, 66);
}

.bg-danger-light {
  background-color: rgb(255, 151, 151);
}

.bg-warning-light {
  background-color: rgb(255, 252, 136);
}

.bg-success-light {
  background-color: rgb(161, 255, 159);
}

.bg-gray-light {
  background-color: #cccccc;
}

.text_align_right > a
{
  text-decoration: none;
}

.margin_right_10
{
  margin-right: 5px;
}

.logOut
{
  color: white;
  cursor: pointer;
  float: right;
}



.my-side-bar-ul{
     width: 100%;
    /* padding-left: 0px; */
    padding: 2%;
}


.zero-margin{
  margin: 0px !important;

}

.margin_left_five
{
    margin-left: 5px;
}

.forCreateFields
{
    border-radius: 5px;
    background-color: #5f9ea0;
    box-shadow: 0px 0px 43px 0px rgba(0, 0, 0, 0.09);
}

.forCreateText
{
    float: right;
    cursor: pointer;
    color: white;
}

.close_button {
  position: absolute;
  right: 21px;
  top: 21px;
}

.closeIconForModal
{
    top: 20px;
    position: absolute;
    float: right;
    right: 21px;
    cursor: pointer;
}

.modalHeader
{
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    color: rgb(34, 34, 34);
}

.alignmentForHeaderCloseButton
{
    height: inherit;
    top: -15px;
    right: -14px;
}


.centered-form .panel{
    background: rgba(255, 255, 255, 0.8);
}

.modal-body
{
    position: relative;
    padding: 0px;
}

.btn:hover, .btn:focus, .btn.focus
{
    color: white;
}



.form-check-label {
  font-size: 18px; /* Adjust font size as needed */
}
.form-check-input[type="radio"] {
  width: 20px; /* Adjust radio button size */
  height: 20px; /* Adjust radio button size */
}

.checkbox-label {
  font-size: 17px; /* Adjust font size as needed */
}

.checkbox-input {
  width: 19px; /* Adjust checkbox size */
  height: 19px; /* Adjust checkbox size */
}

.coa-label {
  font-size: 15px; /* Adjust font size as needed */
}
.coa-input[type="radio"] {
  width: 17px; /* Adjust radio button size */
  height: 17px; /* Adjust radio button size */
}

.panel
{
    margin-bottom: 20px;
    background-color: #fff;
    border-bottom: none;
    padding: 0px;
}

.help-block{
        color:red;
}


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

/* .chosen-disabled
{
  width: 268px!important;
}

.chosen-disabled .chosen-single
{
    width: 268px!important;
    height: 100%;
} */

.drop-retailer .chosen-container {
  width: 173px!important;
  height: 100%;
  margin-left: 0px;
  margin-right: 10px;
}

.drop-retailer .chosen-disabled {
  width: 173px!important;
  height: 100%;
  margin-left: 0px;
  margin-right: 10px;
}

.drop-dc .chosen-container {
  width: 173px!important;
  height: 100%;
  margin-left: 0px;
  margin-right: 10px;
}

.gl-types span{
  font-size: 20px
}

.big-font p{
  font-size: 20px
}

.medium-font p{
  font-size: 18px;
}

.small-font p{
  font-size: 16px;
}

.dayx3 .chosen-container-single .chosen-single{
  width: 350px;
}

.dayx3 .chosen-container-single .chosen-search input[type="text"] {
  width: 340px;
}

.dayx3 .chosen-container.chosen-with-drop .chosen-drop {
  width: 350px;
}

.dayx .chosen-container
{
   width: 100px!important;
   height: 100%;
   margin-left: 39px;
}

.currency .chosen-container-single .chosen-single{
  width: 300px;
}

.currency .chosen-container-single .chosen-search input[type="text"] {
  width: 290px;
}

.currency .chosen-container.chosen-with-drop .chosen-drop {
  width: 300px;
}

.vendor .chosen-container-single .chosen-single{
  width: 250px;
}

.vendor .chosen-container-single .chosen-search input[type="text"] {
  width: 240px;
}

.vendor .chosen-container.chosen-with-drop .chosen-drop {
  width: 250px;
}

.payment .chosen-container-single .chosen-single{
  width: 220px;
}

.payment .chosen-container-single .chosen-search input[type="text"] {
  width: 210px;
}

.payment .chosen-container.chosen-with-drop .chosen-drop {
  width: 220px;
}

.payment-circ {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: red;
  color: white;
  font-size: 10px;
  font-weight: 600;
  position: absolute;
  left: 50px;
}

.payment-relative {
  position: relative;
}

.payment-mode .chosen-container-single .chosen-single{
  width: 150px;
}

.payment-mode .chosen-container-single .chosen-search input[type="text"] {
  width: 140px;
}

.payment-mode .chosen-container.chosen-with-drop .chosen-drop {
  width: 150px;
}

.payment-account .chosen-container-single .chosen-single{
  width: 150px;
}

.payment-account .chosen-container-single .chosen-search input[type="text"] {
  width: 140px;
}

.payment-account .chosen-container.chosen-with-drop .chosen-drop {
  width: 150px;
}

.fin-statement {
  background: white;
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.fin-statement th, .fin-statement td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fin-statement .lvl-one-font {
  color: rgb(33, 149, 252);
  font-weight: bold;
}

.fin-statement .total-font {
  color: rgb(11 45 75) !important;
  font-weight: bold;
  /* text-transform: uppercase; */
}

.fin-statement .total-font p {
  margin: 0;
}

.fin-statement .total-font p.profit-margin {
  /* margin-bottom: 1rem !important; */
  opacity: 60% !important;
  font-weight: 500 !important;
  font-size: 16px !important;
}

.fin-statement .level-two .level-name p {
  padding-left: 1rem;
}

.fin-statement .level-three .level-name p {
  padding-left: 2rem;
}

.fin-statement .level-three p {
  opacity: 80% !important;
  color: #555;
}

.fin-statement .level-total p {
  font-weight: bold;
}

.border-tb {
  border-top: 1px solid #000 !important;
  border-bottom: 1px solid #000 !important;
}

.border-t {
  border-top: 1px solid #000 !important;
}

.border-b {
  border-bottom: 1px solid #000 !important;
}

.border-lr {
  border-left: 1px solid #000 !important;
  border-right: 1px solid #000 !important;
}

.border-l {
  border-left: 1px solid #000 !important;
}

.border-r {
  border-right: 1px solid #000 !important;
}

.color-down p {
  opacity: 80% !important;
  color: #555;
}

.chose a{
  font-size: 15px;
  text-decoration: none;
}

.org-select .chosen-container.chosen-with-drop .chosen-drop {
  clip: auto;
  -webkit-clip-path: none;
  clip-path: none;
  width: 175px;
}

.org-select .chosen-container-single .chosen-single{
  width: 175px;
}

.main-drop .chosen-container .chosen-single {
  height: 100%;
  display: flex;
  align-items: center;
  background: #fff;
  font-size: 16px;
  font-weight: 400;
}

.main-drop .chosen-container-single .chosen-single abbr {
  top: 14px;
}

.pos-btn {
  background-color: #17A2B8;
  border: none;
  color: #fff;
}

.neg-btn {
  background-color: #fff;
  color: #DC3545;
  border: 1px solid #DC3545;
}

.neg-btns {
  background-color: #fff;
  color: #3538dc;
  border: 1px solid #3559dc;
}

.beta-btn {
  background-color: #fff;
  color: #d63384;
  border: 1px solid #d63384;
}

.gama-btn {
  background-color: #fff;
  color: #007bff;
  border: 1px solid #007bff;
}

.alpha-btn {
  background-color: #fff;
  color: #007bff;
  border: 1px solid #007bff;
}

.delta-btn {
  background-color: #fff;
  color: #6f42c1;
  border: 1px solid #6f42c1;
}

.main-drop .chosen-container-single .chosen-single div b {
  position: absolute;
  top: 8px;
}

.btn :hover
{
  background-color: white;
}
.btn:focus {
  box-shadow: none !important;
}
.btn:active {
  box-shadow: none !important;
}

.btn-info:focus {
  box-shadow: none !important;
}
.btn-outline-info:focus {
  box-shadow: none !important;
  color: #138496 !important;
}
.btn-outline-info.btn-no-hover:focus {
  background: transparent;
  color: #138496 !important;
}


.btn-info.btn-no-hover:focus {
  background: var(--Selected-BG, #F4F4F5);
  color: white !important;
}


.show-block
{
        color: forestgreen;
}


._720kb-datepicker-calendar._720kb-datepicker-open, ._720kb-datepicker-calendar._720kb-datepicker-forced-to-open
{
    width: inherit!important;
    float: left!important;
    margin-left: 0px!important;
}

._720kb-datepicker-calendar._720kb-datepicker-open, ._720kb-datepicker-calendar._720kb-datepicker-forced-to-open
{
    width: 272px !important;
    float: none !important;
    margin-left: 0px !important;
}



._720kb-datepicker-calendar-day._720kb-datepicker-today {
  color:#88c641!important;
  background:  #ebfcd8!important;
  box-shadow: -2px 0px 0px 0px #88c641!important;
}

._720kb-datepicker-calendar-header
{
    background: #e90258!important;
}

._720kb-datepicker-calendar-month span
{
            font-size: 13px!important;
            color: white!important;
}

._720kb-datepicker-calendar-years-pagination a, ._720kb-datepicker-calendar-years-pagination a:hover
{
     font-size: 12px;
    padding: 0 7px;
    color: white!important;
    font-weight: normal;
    margin: 3px 1% 0 1%;
    line-height: 20px;
    display: inline-block;

}

._720kb-datepicker-calendar-days-header
{
        max-width: 100%;
    margin: 0 auto;
    padding: 0 2% 0 2%;
    background: white!important;
    border-bottom: 1px solid rgba(0,0,0,0.02);
}

._720kb-datepicker-calendar._720kb-datepicker-open, ._720kb-datepicker-calendar._720kb-datepicker-forced-to-open
{
    margin-top: 40px;
    width: inherit!important;
    /*float: right!important;*/
}


.dateAndTimeField
{
        z-index: 1;
    border-radius: 2px;
    border-style: solid;
    border-width: 1px;
    border-color: #e7e9eb;
    background-color: #ffffff;
    height: 29.5px;
    transform: scaleX(1.0008);
}

.inputFieldForDateAndTime
{
    border: none;
    padding: 4px 4px;
}

/*.inputFieldForDateAndTime
{
    border: none;
    padding: 4px 8px;
}
*/

textarea:focus, input:focus{
    outline: none;
}


.moment-picker td.today
{
    color: #88c641!important;
    background: #ebfcd8!important;
    box-shadow: -2px 0px 0px 0px #88c641!important;
}

.moment-picker .header-view th
{
    font-weight: normal;
    -webkit-font-smoothing: antialiased;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 18px;
    color: white;
    background: #e90258!important;
}

.angularjs-datetime-picker
{
    z-index: 1111;
}


.angularjs-datetime-picker > .adp-month
{
    -webkit-font-smoothing: antialiased;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 18px;
    color: white;
    background: #e90258!important;

}


.angularjs-datetime-picker > .adp-month > button.adp-next
{
    color: white;
}


.angularjs-datetime-picker > .adp-month > button.adp-prev
{
    color: white;
}


.angularjs-datetime-picker > .adp-days > .adp-day.selectable:hover
{
    color: #88c641!important;
    background: #ebfcd8!important;
    box-shadow: -2px 0px 0px 0px #88c641!important;
}

.padding_left_zero
{
    padding-left: 0px;
}

.display_block
{
    display: block!important;
}

.margin_top_20px
{
    margin-top: 20px;
}


.dropdown-menu li {
  position: relative;
  }
.dropdown-menu .dropdown-submenu {
display: none;
position: absolute;
left: 100%;
top: -7px;
}
.dropdown-menu .dropdown-submenu-left {
right: 100%;
left: auto;
}
.dropdown-menu > li:hover > .dropdown-submenu {
display: block;
}

.toast {
  max-width: 550px !important;
}

#toast-container {
  width: 40%;
}


#toast-container > div {
  font-size: 20px;
  padding: 15px 15px 15px 50px;
  width: 100% !important;
}

/* @media all and (max-width: 240px) {
  #toast-container > div {
    padding: 8px 8px 8px 50px;
    width: 13em !important;
  }
  #toast-container .toast-close-button {
    right: -0.2em;
    top: -0.2em;
}
  }
@media all and (min-width: 241px) and (max-width: 480px) {
  #toast-container  > div {
    padding: 8px 8px 8px 50px;
    width: 20em !important;
  }
  #toast-container .toast-close-button {
    right: -0.2em;
    top: -0.2em;
}
}
@media all and (min-width: 481px) and (max-width: 768px) {
  #toast-container > div {
    padding: 15px 15px 15px 50px;
    width: 35em !important;
  }
} */

.chosen-select {
    width: 100px!important;
}

.modal-content > .modal-body-width {
    width: 1200px!important;
}

.my-xlg-modal > .modal-lg{
    width: 85% !important;
}


.manual-chosen > .chosen-container
{
  width: 82px!important;
}

.margin_top_30px
{
    margin-top: 30px;
}

.main_logo
{
    max-width: 20%;
    height: auto;
    position: relative;
    display: block;
    margin: 0 auto;
}

.myCloseBtn{
    background-color: white;
    color: red;
     border-color: gray;
     margin: 5px;
}

.mySubmitBtn{

        color: #4cae4c;
    background-color: #f9fbf9;
    border-color: gray;
    margin: 5px;

}

.borderForjobsheet{
    border-right: 1px solid darkgray;
}


.coa-heirarchy-l1 {
  font-size: 14px;
  font-weight: 700;
}

.coa-heirarchy-l2 {
  font-size: 13px;
  font-weight: 600;
}

.coa-heirarchy-l3 {
  font-size: 12px;
  font-weight: 500;
}

.no_padding_leftandright {
    margin-right: 0px;
    margin-left: 0px;
}

.printer
{
    float: right;
    margin-right: 10px;
}


#cssmenu ul,
#cssmenu li,
#cssmenu span,
#cssmenu a {
  margin: 0;
  padding: 0;
  position: relative;
}
#cssmenu {
    font-family: verdana;
    font-size: 12px;
    font-weight: 200;
    top: 0px;
    color: #0000;
  line-height: 1;
  border-radius: 5px 5px 0 0;
  border-bottom: 2px solid white;
  width: auto;
    background-color: #ffff;
    box-shadow: 0 4px 6px -6px #222;
}
#cssmenu:after,
#cssmenu ul:after {
  content: '';
  display: block;
  clear: both;
}
#cssmenu a {
  color: #0000;
  display: block;
  /* font-family: Helvetica, Arial, Verdana, sans-serif; */
  padding: 19px 20px;
  text-decoration: none;
  border-left: 1px solid white;
}
#cssmenu ul {
  list-style: none;
}
#cssmenu > ul > li {
  display: inline-block;
  /* float: left; */
  margin: 0;
}
#cssmenu.align-center {
  text-align: center;
}
#cssmenu.align-center > ul > li {
  float: none;
}
#cssmenu.align-center ul ul {
  text-align: left;
}
#cssmenu.align-right > ul {
  float: right;
}
#cssmenu.align-right ul ul {
  text-align: right;
}
#cssmenu > ul > li > a {
  color: #0000;
  font-size: 12px;
}
#cssmenu > ul > li:hover:after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 50%;
  bottom: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  /*border-bottom: 10px solid #0fa1e0;*/
  /*border-bottom: 10px solid white;*/
  margin-left: -10px;
}
#cssmenu > ul > li:first-child > a {
  border-radius: 5px 0 0 0;
  -moz-border-radius: 5px 0 0 0;
  -webkit-border-radius: 5px 0 0 0;
}
#cssmenu.align-right > ul > li:first-child > a,
#cssmenu.align-center > ul > li:first-child > a {
  border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
}
#cssmenu.align-right > ul > li:last-child > a {
  border-radius: 0 5px 0 0;
  -moz-border-radius: 0 5px 0 0;
  -webkit-border-radius: 0 5px 0 0;
}
/* #cssmenu > ul > li.active > a,
#cssmenu > ul > li:hover > a {
  color: #ffffff;
} */
#map{
  width: 100%;
  height: 100%;
}
.modalmap{
  height:500px !important;
}
#cssmenu .has-sub {
  z-index: 999;
}
#cssmenu .has-sub:hover > ul {
  display: block;
}
#cssmenu .has-sub ul {
  display: none;
  position: absolute;
  width: 200px;
  top: 100%;
  left: 0;
}
#cssmenu.align-right .has-sub ul {
  left: auto;
  right: 0;
}
#cssmenu .has-sub ul li {
  margin-bottom: -1px;
}
#cssmenu .has-sub ul li a {
  background: darkgray;
       border-bottom: 1px dotted white;
       text-decoration: none;
  color: #e1ffff;
  font-size: 11px;
  filter: none;
  display: block;
  line-height: 120%;
  padding: 10px;
}
#cssmenu .has-sub ul li:hover a {
 /* background: #0c7fb0;*/
 background: gray;
}
/* #cssmenu ul ul li:hover > a {
  color: #ffffff;
} */
#cssmenu .has-sub .has-sub:hover > ul {
  display: block;
}
#cssmenu .has-sub .has-sub ul {
  display: none;
  position: absolute;
  left: 100%;
  top: 0;
}
#cssmenu.align-right .has-sub .has-sub ul,
#cssmenu.align-right ul ul ul {
  left: auto;
  right: 100%;
}
#cssmenu .has-sub .has-sub ul li a {
  background: #0c7fb0;
  border-bottom: 1px dotted #31b7f1;
}
#cssmenu .has-sub .has-sub ul li a:hover {
  /*background: #0a6d98;*/
  background:white;
}
#cssmenu ul ul li.last > a,
#cssmenu ul ul li:last-child > a,
#cssmenu ul ul ul li.last > a,
#cssmenu ul ul ul li:last-child > a,
#cssmenu .has-sub ul li:last-child > a,
#cssmenu .has-sub ul li.last > a {
  border-bottom: 0;
}

.drop-select {
  height: 40px;
}

#menu-content #first-navlink a{
  color: #00A3FF;
}

#menu-content li:first-child .dash-anchor:before {
  font-family: FontAwesome;
  content: "\f061";
  display: inline-block;
  padding-left: 10px;
  padding-right: 10px;
  vertical-align: middle;
  color: #00A3FF;
  /* float: right; */
}

.nav-side-menu {
  overflow: auto;
  font-family: verdana;
  font-size: 12px;
  font-weight: 200;
  background-color: #FFFF;
  position: fixed;
  /*top: 0px;*/
  width: 15%;
  height: 100%;
  color: #0000;
}
.nav-side-menu .brand {
  background-color: #FFFF;
  line-height: 50px;
  display: block;
  text-align: center;
  font-size: 14px;
}
.nav-side-menu .toggle-btn {
  display: none;
}
.nav-side-menu ul,
.nav-side-menu li {
  list-style: none;
  padding: 0px;
  margin: 0px;
  line-height: 35px;
  cursor: pointer;
}

.nav-side-menu ul :not(collapsed) .arrow:before,
.nav-side-menu li :not(collapsed) .arrow:before {
  font-family: FontAwesome;
  content: "\f078";
  display: inline-block;
  padding-left: 10px;
  padding-right: 10px;
  vertical-align: middle;
  /* float: right; */
}

.sub-menu-header a,
.sub-menu li {
  color: rgba(0, 0, 0, 0.5);
}

.sub-menu-header a .active,
.sub-menu li .active{
  color: #00A3FF;
}

/* .nav-side-menu ul .active,
.nav-side-menu li .active {
  background-color: #4f5b69;
}
.nav-side-menu ul .sub-menu li.active,
.nav-side-menu li .sub-menu li.active {
  color: #d19b3d;
}
.nav-side-menu ul .sub-menu li.active a,
.nav-side-menu li .sub-menu li.active a {
  color: #d19b3d;
} */
.nav-side-menu ul .sub-menu li,
.nav-side-menu li .sub-menu li {
  background-color: #FFFFFF;
  border: none;
  line-height: 28px;
  /* border-bottom: 1px solid #23282e; */
  margin-left: 0px;
}
.nav-side-menu ul .sub-menu li:hover,
.nav-side-menu li .sub-menu li:hover {
  background-color: gray ;
}
.nav-side-menu ul .sub-menu li:before,
.nav-side-menu li .sub-menu li:before {
  font-family: FontAwesome;
  content: "\f105";
  display: inline-block;
  padding-left: 10px;
  padding-right: 10px;
  vertical-align: middle;
}

#cssmenu ul li:before,
#cssmenu ul li ul li:before {
  font-family: FontAwesome;
}

#cssmenu ul li:hover,
#cssmenu ul li ul li:hover
{
    background-color: #4f5b69;
}
.nav-side-menu li {
  padding-left: 0px;
  /* border-left: 3px solid #2e353d; */
  /* border-bottom: 1px solid #23282e; */
}

.nav-side-menu .menu-header a {
  text-decoration: none;
  color: #000000;
}
.nav-side-menu li a i {
  padding-left: 10px;
  width: 20px;
  padding-right: 20px;
}
.nav-side-menu li:hover {
  background-color: #4f5b69;
}
@media (max-width: 767px) {
  .nav-side-menu {
    position: relative;
    width: 100%;
    margin-bottom: 10px;
  }
  .nav-side-menu .toggle-btn {
    display: block;
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 10 !important;
    padding: 3px;
    background-color: #ffffff;
    color: #0000;
    width: 40px;
    text-align: center;
  }
  .brand {
    text-align: left !important;
    font-size: 22px;
    padding-left: 20px;
    line-height: 50px !important;
  }
}
@media (min-width: 767px) {
  .nav-side-menu .menu-list .menu-content {
    display: block;
  }
}

#cssmenu ul li span
{
    overflow: auto;
    font-family: verdana;
    font-size: 14px;
    font-weight: 200;
    color: #0000;
}

.onoffswitch {
    margin-top: 10px;
    position: relative; width: 90px;
    --webkit-user-select:none; 
    --moz-user-select:none; 
    --ms-user-select: none;
}

.onoffswitch-checkbox {
    display: none;
}

.onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer;
   /* border: 2px solid #999999; */
    border-radius: 20px;
}

.onoffswitch-inner {
    display: block; width: 200%; margin-left: -100%;
    -moz-transition: margin 0.3s ease-in 0s; -webkit-transition: margin 0.3s ease-in 0s;
    -o-transition: margin 0.3s ease-in 0s; transition: margin 0.3s ease-in 0s;
}

.onoffswitch-inner:before, .onoffswitch-inner:after {
    display: block; float: left; width: 50%; height: 30px; padding: 0; line-height: 30px;
    font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

.onoffswitch-inner:before {
    content: "sidebar";
    padding-left: 6px;
    background-color: #2FCCFF;
    color: #FFFFFF;
    font-family: verdana;
    font-size: 14px;
    font-weight: 200;
    color: white;
}

.onoffswitch-inner:after {
    content: "topbar";
    padding-right: 10px;
    background-color: #EEEEEE; color: #999999;
    text-align: right;
    font-family: verdana;
    font-size: 12px;
        padding: 8px;
    font-weight: 200;
    top: 0px;
    color: black;
    font-family: verdana;
    font-size: 14px;
    font-weight: 200;
  line-height: 1;
}

.onoffswitch-switch {
    display: block; width: 18px; margin: 6px;
    background: #FFFFFF;
    border: 2px solid #999999; border-radius: 20px;
    position: absolute; top: 0; bottom: 0; right: 56px;
    -moz-transition: all 0.3s ease-in 0s; -webkit-transition: all 0.3s ease-in 0s;
    -o-transition: all 0.3s ease-in 0s; transition: all 0.3s ease-in 0s;
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    right: 0px;
}

#cssmenu ul .toggleButton
{
        margin: auto;
    padding: auto;
    position: inherit;
}

#cssmenu ul li a span i
{
  margin-right: 5px;
}


.cursors
{
  cursor: pointer;
}

#main {
    padding: 2px;
    margin: auto;
}

table.timecard {
      margin: auto;
    border-collapse: collapse;
    border: 1px solid #fff;
    border-style: hidden;
}

table.timecard caption {
  background-color: #f79646;
  color: #fff;
  font-size: x-large;
  font-weight: bold;
  letter-spacing: .3em;
}

table.timecard thead th {
  padding: 8px;
  background-color: #fde9d9;
  font-size: large;
}

table.timecard thead th#thDay {
  width: 40%;
}

table.timecard thead th#thRegular, table.timecard thead th#thOvertime, table.timecard thead th#thTotal {
  width: 20%;
}

table.timecard th, table.timecard td {
  padding: 3px;
  border-width: 1px;
  border-style: solid;
  border-color: #f79646 #ccc;
}

table.timecard td {
  text-align: right;
}

table.timecard tbody th {
    text-align: left;
    font-weight: normal;
    font-weight: 600;
    font-family: inherit;
}

table.timecard tfoot {
  font-weight: bold;
  font-size: large;
  background-color: #687886;
  color: #fff;
}

table.timecard tr.even {
  background-color: #fde9d9;
}

table.timecard tr.classOne {
  background-color: #c4ffcf;
}

table.timecard tr.styleOne {
  background-color:#ffeac4;
}

.headerForDashboard
{
   font-size: 40px;
    font-weight: 600;
    color: #80bb71;
    text-align: center;
}

.float_right
{
  float: right!important;
}

label {
    display: -webkit-box!important;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: bold;
}
.shoppics{
  display: block;
  width: 150px;
  height: 100px;
  border-image: 2px solid #000000;
}


.sortableItem, .placeholder {
    padding: 2px;
    width: 50px;
    height: 20px;
    border: 1px solid #333;
    background: #EEE;
}

.placeholder {
    background: #AEF;
}

.scroll{
         height: 100%;
        }



.dashboardtable{
  padding: 10px;
    border: 1px solid #bdc3bd;
    margin: 10px;
    /*width: 30%;*/
    box-shadow: inset -1px -1px 5px;
    min-width: min-content;
}


.hide-element {
  display: none;
  width: 30%;
}

#cart-button {
  position: relative;
  padding: 7px;
}

#cart-count {
  background-color: red;
  color: #fff;
  /* padding: 5px; */
  border-radius: 50%;
  position: absolute;
  bottom: 11px;
  right: 25px;
  left: 33px;
  width: 20px;
  height: 20px;
  /* text-align: center; */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* .cart-items {
  margin-left: 90px;
} */

.cart-charges {
  margin-left: 50px;
  /* margin-top: 30px */
}

.cart-retailer {
  /* margin-left: 50px; */
  margin-top: 15px
}

.address-card {
  height: 150px;
  overflow-y: scroll;
}

.quantity-input {
  width: 60%;
}

.quantity-input input{
  width: 100%;
  border: 1px solid #AEF;
}

.card-batch {
 border: 1px solid #bdc3bd;
 padding: 10px;
 /* margin: 10px; */
}

.myVerticalNavBar{
  min-height: 50px;
}

.myVerticalNavBar > .nav-side-menu{
  min-height: inherit;
  /* height: calc(100% - 55px); */
  box-shadow: 8px 0px 25px -10px rgba(0, 0, 0, 0.25);
}

.my-toggle-btn{
  min-height: 50px;
  color: green;
    background-color: black;
}

.hover-table-column td:hover {
  background-color: rgba(72, 167, 84, 0.075);
}


.pac-container{
  z-index: 99999;
}


.display-inline-block{

  display: inline-block;
}

.wd-30{
  width: 30%;
}

.ml-10{

  margin-left: 10px;
}

.inner-submenu::before{
  display: none !important;

}

.togelswitch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.togelswitch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: green;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}


.fastMoveTable {
  padding: 10px;
    border: 1px solid #bdc3bd;
    margin: 10px;
    box-shadow: inset -1px -1px 5px;
}

.fastMovesubHeader {
   font-size: 3vw;
    font-weight: 600;
    color: #80bb71;
    text-align: center;
}

.fastMovesubHeader  i{
  font-size: 2vw;
  color: black;
  position: absolute;
  padding: 1vw;

}

.display-flex{
  display: inline-flex;
  padding: 5px;
}

.fastMoveTableHeaderBg{
  background-color: whitesmoke;
  margin: 10px;
}
.thead{
  background-color: #9e9e9e;
}

.commRefresh{
  margin-right: 5vw;
  float: right;
    font-size: 25px;
    color: gray;
}

.commRefresh > span{
    font-weight: 600;
    font-family: serif;
    color: black;
    font-size: 20px;
}

/* .nav-tabs .nav-link {
  border: 1px solid;
} */
/*
.nav-tabs {
  border: none;
} */

/* .nav-tabs > li {
  margin-right: 10px;
} */

.nav-tabs > li > a {
  /* color: #00A3FF; */
  /* border: 1px solid #109CF1; */
  /* box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25); */
  /* border-radius: 4px; */
  /* font-family: 'Poppins'; */
  /* font-style: normal; */
  font-weight: 600;
  font-size: 15px;
  /* line-height: 20px; */

  text-align: center;
  letter-spacing: 0.01em;
}

/* .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus{
  color: #fff;
  cursor: default;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-size: 13px;
  line-height: 20px;
  background-color: #109CF1;
} */
.nav-tabs {
  border-bottom: none;
}

.action-btn {
  background: #109CF1;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25);
  border-radius: 4px;
  width: 100px;
  height: 42px;
  left: 924px;
  top: 121px;
    font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-size: 13px;
  line-height: 20px;
  /* identical to box height */

  text-align: center;
  letter-spacing: 0.01em;
}

.nav-tabs {
    margin-bottom: 20px;
    display: flex;
}

.action-btn-secondary {
  /* background: #109CF1; */
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25);
  border-radius: 4px;
  /* width: 100px; */
  height: 42px;
  left: 924px;
  top: 121px;
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-size: 13px;
  line-height: 20px;
  /* identical to box height */

  text-align: center;
  letter-spacing: 0.01em;
}

.nav-tabs {
    margin-bottom: 20px;
    display: flex;
}

.progress-ww {
  font-size: 0.8rem;
  line-height:0.8rem;
  text-align:center;


}

.sheet-header {
  font-size: 16px;
  font-weight: 700;
  border-bottom: 1px solid #000;
  margin-right: 5px;
}

.sheet-header-2 {
  font-size: 20px;
  font-weight: 700;
  border-bottom: 1px solid #000;
  margin-right: 5px;
}

.variance-red {
  color: red;
}

.change-line {
  cursor: pointer;
}

.variance-green {
  color: green;
}

.item-n{
  font-size: 15px;
  padding: 0;
}

.item-n p{
  padding: 0;
}

.item-h p{
  padding: 0;
}

.item-h {
  font-size: 15px;
  font-weight: 700;
  padding: 0;
}

.main-logo {
  width: 150px;
  height: 50px;
}

.dash-search {
  display: flex;
  position: relative;
}

.dash-search p{
  position: absolute;
  top: 3px;
  left: 470px;
}

.income {
  height: 110px;
  background-color: #000000;
  color: #fff;
}

.other {
  height: 110px;
  background-color: gray;
  color: #fff;
}

.other h3{
  border-bottom: 1px #fff solid;
  display: inline-block;
}

.income h3 {
  border-bottom: 1px #fff solid;
  display: inline-block;
}

.statement-cross {
  padding: 5px;
}

.statement-cross p {
  font-size: 10px;
  padding: 0;
  font-style: italic;
}

.statement-cross p span span{
  font-size: 1.5rem;
  vertical-align: middle;
  color: red;
  font-weight: bold;
}

.page-heading:before {
  font-family: FontAwesome;
  content: "\f105";
  display: inline-block;
  padding-left: 10px;
  padding-right: 10px;
  vertical-align: middle;
}

select.customSelect{
  width: 100%;
    height: 5vh;
    margin: 2px;
    padding: 2px;
    border: 1px solid #555;
    border-radius: 2vw;
    background-color: whitesmoke;
}
select.customSelect, option:focus {
  font-weight: bold;
}

.form-group {
  margin-bottom: 0px;
}

.form-group > .chosen-container {
  width: 100% !important;
}

.form-group > .chosen-container > .chosen-single, .chosen-drop, .chosen-drop > .chosen-search {
  width: 100% !important;
}

.chosen-drop > .chosen-search > .chosen-search-input {
  width: 100% !important;
}

.search-box{
    width: 100%;
    display: inline-flex;
    padding: 10px;
    box-shadow: inset 0px 0px 4px #aaaaaa;
    font-size: 15px;
    background: whitesmoke;
}

div.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  background: whitesmoke;
}

div.card{
    border: 1px solid darkgrey;
    padding: 10px;
    margin-top: 10px;
    box-shadow: inset 0px 0px 4px #999;
}


.table-custom > tbody > tr:nth-of-type(even){
  background-color: #fff !important;
}

.danger-zone{
  background-color: red !important;
}

@media (min-width: 992px){

    .verticalNavBarwidth {
        width: 18.55%;
        /* box-shadow: 8px 0px 25px -10px rgba(0, 0, 0, 0.25); */
    }
}

.table-epic {
  /* font-family: Arial, Helvetica, sans-serif; */
  border-collapse: collapse;
  width: 100%;
}

.table-epic td, .table-epic th {
  border: 1px solid #ddd;
  padding: 8px;
}

.table-epic tbody {
  background-color: white;
}

.table-epic.table-epic-stripes tr:nth-child(even){
  background-color: #f2f2f2 !important;
}

.table-epic.table-epic-hover tr:hover {background-color: #ddd;}

/* #employees th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #04AA6D;
  color: white;
} */

/* Table new Main */

.table-container {
  padding: 1rem;
  background-color: #fff;
  width: 100%;
  overflow: hidden;
}

.table-wrapper {
  background-color: #fff;
  overflow-x: auto;
}

.table-wrapper::-webkit-scrollbar {
  height: 8px;
  width: 8px;
}

.table-wrapper::-webkit-scrollbar-thumb {
  background: var(--line-color);
  border-radius: 10px;
}

.table-main-1 {
  font-size: 14px;
  width: 100%;
}

.table-main-1 tr:focus-visible {
  outline: none;
}

.table-main-1 thead {
  font-weight: bold;
  background-color: var(--selected-bg);
  border-collapse: collapse;
}

.table-main-1.table-hover tbody tr {
  background-color: #fff;
  transition: 0.3s;
  border-radius: 10px;
}

.table-main-1.table-hover tbody tr:hover {
  background-color: var(--hover-bg);
}

.table-main-1 tbody .tr-hover {
  background-color: #fff;
}

.table-main-1 tbody .tr-hover:hover {
  background-color: var(--hover-bg);
}

/* For sticky column */
.table-main-1 thead th {
  background-color: var(--selected-bg);
}

.table-main-1 tbody td {
  background-color: #fff;
}

.table-main-1.table-hover tbody tr td {
  background-color: #fff;
}

.table-main-1.table-hover tbody tr:hover td {
  background-color: var(--hover-bg);
}

.table-main-1 tbody .tr-hover td {
  background-color: #fff;
}

.table-main-1 tbody .tr-hover:hover td {
  background-color: var(--hover-bg);
}
/* For sticky column */

.table-main-1 .big-row-1 tr td,
.table-main-1 tr.big-row-1 td {
  padding-top: 18px;
  padding-bottom: 10px;
}

.table-main-1 th {
  border: 1px solid var(--line-color2);
  line-height: 14.88px;
}

.table-main-1 th * {
  font-weight: bold;
  font-size: 14px;
  margin: 0px;
}

/* .table-main-1 th h3 {
  margin: 0px;
  font-size: 14px;
}

.table-main-1 th h4 {
  margin: 0px;
  font-size: 13px;
}

.table-main-1 th h5 {
  margin: 0px;
  font-size: 12px;
} */

.table-main-1 p {
  margin: 0px;
  letter-spacing: 0.5px;
}

.table-main-1 th, .table-main-1 td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.table-main-1 th {
  font-size: 13px;
  padding: 1rem;
  vertical-align: bottom;
}

.table-main-1 td {
  font-size: 14px;
  padding: 0.5rem 1rem;
}

.table-main-1 tr.bg-selected {
  background-color: var(--selected-bg);
}

.table-main-1 tr.highlight {
  background-color: var(--hover-bg);
}

.table-main-1 .selected-row {
  background-color: var(--selected-bg) !important;
}
/* For sticky column */
.table-main-1 tr.bg-selected td {
  background-color: var(--selected-bg);
}

.table-main-1 tr.highlight td {
  background-color: var(--hover-bg);
}

.table-main-1 .selected-row td {
  background-color: var(--selected-bg) !important;
}
/* For sticky Column */

.table-main-1 tr.bold {
  font-weight: bold;
}

.table-main-1 .bold {
  font-weight: bold;
}

.table-main-1 tr .info-text {
  color: var(--subtext-grey-r-text, #71717A);
  font-size: 12px;
  font-weight: 400;
  font-family: "Geist-Light";
}

.table-main-1 tr .description-info {
  color: #94A3B8;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 300px;
}

.table-main-1 tr .status-text {
  border-radius: 4px;
  padding: 10px;
  color: #18AF66;
  background-color: #E1F0E9;
  font-family: "Geist-Light";

  border: 1px solid #E4E4E7;
}

.table-main-1 tr.border-1 {
  border: 1px solid var(--line-color2);
}

.fs-table {
  margin-bottom: 1rem;
}

.fs-table.sticky-first-col th:first-child,
.fs-table.sticky-first-col td:first-child {
  position: sticky;
  left: 0;
}

.fs-table .period-type td * {
  color: #94A3B8;
  font-size: 12px;
  font-family: 'Geist-Light';
}

.fs-table .lvl-one-font {
  color: var(--purple-accent);
}

.cf-table .lvl-one-font td {
  font-size: 16px !important;
  font-weight: bold;
}

.fs-table td.blank-space {
  height: 20px;
}

.fs-table tr.total-font {
  border: 1px solid var(--line-color2);
}

.fs-table .total-font {
  color: var(--black) !important;
  font-weight: bold;
  background-color: var(--selected-bg);
  /* border: 1px solid var(--line-color2); */
}

.fs-table .total-font td {
  background-color: var(--selected-bg);
}

.fs-table .total-font.bg-white td {
  background-color: #fff !important;
}

.fs-table .top-bottom-border,
.fs-table .total-font.top-bottom-border {
  border: none;
  border-top: 1px solid var(--line-color2);
  border-bottom: 1px solid var(--line-color2);
}

.fs-table .total-font p {
  margin: 0;
}

.fs-table .total-font p.profit-margin {
  /* margin-bottom: 1rem !important; */
  opacity: 60% !important;
  font-weight: 500 !important;
  font-size: 16px !important;
}

.fs-table .level-two .level-name p {
  padding-left: 1rem;
}

.fs-table .level-three .level-name p {
  padding-left: 2rem;
}

.fs-table .level-two p {
  color: var(--black);
}

.fs-table .level-three p {
  color: #71717A;
}

.fs-table .level-total p {
  font-weight: bold;
}


/* ============== Accounting Periods Table ============================ */

.accounting_periods_table_container {
  background-color: #fff;
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--line-color);
}

.accounting_periods_table {
  width: 100%;
}

.accounting_periods_table td {
  padding: 1rem;
  border: 1px solid var(--line-color);
  white-space: nowrap;
}

.accounting_periods_table tr:first-child {
  position: sticky;
}

.accounting_periods_table .accounting_period {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1rem;
  text-align: center;
  text-wrap: nowrap;
  white-space: nowrap;
}

.accounting_periods_table .accounting_period p {
  margin: 0px;
}

.period_closed_bg {
  background-color: rgb(215, 238, 254) !important;
}

.period_soft_closed_bg {
  background-color: rgb(228, 93, 90) !important;
}

.period_opened_bg {
  background-color: #FFF !important;
}

.bg-selected {
  background-color: var(--selected-bg);
}



input.form-control{
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: #FFF;
  padding: 8px 12px;
  font-size: 14px;
  outline: none;
  line-height: 20px;
  font-family: 'Geist-Regular';
  height: fit-content;
}

.chosen-container-multi .chosen-choices{
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: #FFF;
  padding: 8px 12px;
  font-size: 14px;
  outline: none;

  /* Button/Secondary */
  /* font-family: Geist; */
  /* font-size: 12px; */
  font-style: normal;
  font-weight: 106;
  line-height: 20px;
}

.chosen-container-multi .chosen-choices li.search-field input[type="text"]{
  height: auto;
  margin: 0px;
  width: 100% !important;
}


button{
  border-radius: var(--Border-Radius, 4px);
  background: var(--Button-Accent, #1C1C1C);
  padding: 8px 16px;
  color: var(--White-text, #FAFAFA);

  /* Button/primary */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  outline: none;
}

.button-outline {
  background-color: white;
  color: var(--black);
  outline: var(--black);
}

.button-table-o {
  background-color: transparent;
  padding: 5px 10px;
  color: var(--subtext-grey-r-text, #71717A);
  outline: none;
  border: 1px solid var(--Stroke--Grey, #e4e4e7);
}

button:disabled {
  opacity: 0.7;
}


/* ==================== Account Transactions Page ================================ */

.account_transactions_filters {
  padding: 8px 8px 8px 24px;
  background-color: white;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.account_transactions_main_content {
  margin-top: 16px;
  padding-left: 24px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.account_transactions_table {
  background-color: white;
  min-width: 80%;
  padding: 24px;
}

.account_transactions_table .account_name_container {
  padding: 19px 8px 19px 16px;
  font-weight: bold;
}





textarea.form-control{
  /* width: 100%; */
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: #FFF;
  color: var(--Black, #1C1C1C);
  padding: 8px 12px;
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px;
  outline: none;
}




/* ================Select= style================== */

.chosen-container-single .chosen-single{
  padding: 8px 12px;
  height: auto;
  font-size: 14px;
  line-height: 20px;
  background: white;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  border-radius: 4px;
}

.chosen-container-single .chosen-single div{
  width: 32px;
}

.chosen-container-single .chosen-single div b{
    display: block;
    width: 100%;
    height: 100%;
    background: url(/assets/images/selectDropdown.svg) no-repeat 50% 10px;
    background-size: 12px;
}


.custom-select{
  font-size: 14px;
  line-height: 20px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background-image: url(/assets/images/selectDropdown.svg);
  background-repeat: no-repeat;
  background-position: right 6px top 50%;
  background-size: 12px;
  border-radius: 4px;
}

.payment .chosen-container-single .chosen-single{
  width: 100%;
}


.chosen-container-single .chosen-single abbr{
  top: 50%;
  transform: translateY(-50%);
}



/* ===============container styling====================== */

.container{
  max-width: 100%;
}

.page_container {
  padding-right: 20px;
}

.page_container > ul{
  height: 100vh;
  display: flex;
  flex-direction: column;
  flex-wrap: unset;
}


.page_container .nav-tabs{
 margin-bottom: 0px;
}

.table-container{
  height: 100%;
}

.page_flex{
  display: flex;
  flex-direction: column;
  height: 100vh;
}

.page_flex .forecastingv2_page_container{
  align-self: stretch;
  height: 100%;
}

.page_flex .tab-content{
  height: 100%;
}


.tab-content>.active{
  height: 100%;
}

.table-wrapper{
  height: 100%;
}

/* ===============Style for Chosen Dropdown================= */

.select_design{
  width: 50%;
}


.chosen-container-single .chosen-drop{
  margin-top: 5px;
  border-radius: 10px;
  border: none;
}


.chosen-container-single .chosen-search{
  padding: 0px;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.chosen-container-active.chosen-with-drop .chosen-single{
  background-image: none;
}


.chosen-container-single .chosen-search input[type="text"]{
  border: none;
  padding: 8px 12px;
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  background-image: url('/assets/images/search.svg'); /* Set custom image */
  background-size: 12px; /* Adjust size of the custom image */
  background-repeat: no-repeat; /* Ensure the image is not repeated */
  background-position: right 12px center;
}

.chosen-container .chosen-results li{
  padding: 10px 12px;
  font-family: 'Geist-Regular';
  font-size: 14px;
}

.chosen-container .chosen-results::-webkit-scrollbar{
  display: none;
}

.chosen-container .chosen-results{
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.vendor .chosen-container-single .chosen-single{
  width: auto;
}



.select_group{
  display: flex;
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: stretch;
  align-items: stretch;
  width: 100%
}

.select_group .chosen-container {
  position: relative;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  width: 1% !important;
  min-width: 0;
  margin-bottom: 0;
}

.dashboardv2_location_filter .chosen-container{
  min-width: 120 !important;
  width: fit-content !important;
}

.dashboardv2_location_filter .chosen-container-single .chosen-search{
  display: none;
}

.no-search .chosen-container-single .chosen-search{
  display: none;
}



/* ===============Login Page CSS================= */


label{
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0em;
  text-align: left;
  font-family: 'Geist-Regular';
  margin-bottom: 6px;
}

input{
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: #FFF;
  padding: 8px 12px;
  font-size: 14px;
  outline: none;
}




/* ==============Signin page================= */

.sign_in_page{
  width: 100%;
  position: relative;
}


.background_gradient{
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
}

.background_gradient img{
  width: 100%;
}


.signin_popup{
  width: 370px;
  max-width: 95%;
  position: absolute;
  top: 51px;
  left: 50%;
  border-radius: 10px;
  transform: translate(-50%);
  background-color: white;
  border: 0.7px solid #E4E4E7;
  padding: 24px;
}

.auth-brand-wrapper {
  display: flex;
  align-items: center;
}

.auth-brand-wrapper img {
  height: 29.01px;
}

.auth-tabs-container {
  display: flex;
  padding: 5px;
  margin-block: 36px;
}

.auth-tab {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50%;
  cursor: pointer;
  border-radius: 3px;
}

.auth-tab p {
  margin: 0;
  color: rgba(148, 163, 184, 1);
  font-size: 14px;
  line-height: 17.36px;
  font-weight: 400;
}

.auth-tab.active {
  background: rgba(244, 244, 245, 1);
}

.auth-tab.active p {
  padding: 11px;
  color: rgba(28, 28, 28, 1);
  font-weight: 500;
}


.auth-or-container {
  position: relative;
  width: 100%;
  height: 20px;
  margin-block: 13px;
}

.auth-or-container .divider {
  width: 100%;
  height: 1px;
  background-color: rgba(228, 228, 231, 1);
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.auth-or-container p {
  margin: 0;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  background-color: white;
  width: 62px;
  text-align: center;
  font-size: 12px;
  line-height: 20px;
  color: rgba(113, 113, 122, 1);
  font-weight: 500;
}


.signin_popup_header{
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.signin_popup h1{
  font-size: 24px;
  font-size: 24px;
  font-weight: 126;
  line-height: 32px;
  letter-spacing: -0.006em;
  text-align: left;
  font-family: 'Geist-Medium';
}

.signup_input_container {
  margin-top: 24px;
}


.signin_input_container {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  width: 100%;
}


.signin_input_container .input_container{
  display: flex;
  flex-direction: column;
  width: 100%;
}


.signin_input_container .input_container input::placeholder {
  color: rgba(113, 113, 122, 0.5);
}

.signin_input_container .input_container input:-ms-input-placeholder,
.signin_input_container .input_container input::-ms-input-placeholder,
.signin_input_container .input_container input::-moz-placeholder,
.signin_input_container .input_container input:-webkit-input-placeholder {
  color: rgba(113, 113, 122, 0.5);
}

.input_error_text {
  font-family: Lato;
  font-size: 12px;
  font-weight: 400;
  color: red;
  border-radius: 5px;
  padding-left: 10px;
  padding-top: 4px;
}

.submit_error_text {
  color: red;
  text-align: center;
  margin-top: 1rem;
  margin-bottom: 0;
}

.password_container {
  position: relative;
}

.password_container svg {
  position: absolute;
  top: 10px;
  right: 12px;
  height: 16px;
  width: 16px;
  cursor: pointer;
}

.password_container svg:focus {
  outline: none;
}


.signin_button_container{
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 36px;
}

.sigin_submit_button button{
  
  width: 237px;
  padding: 8px 16px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Black, #1C1C1C);
  background: var(--Black, #1C1C1C);

  color: var(--White-text, #FAFAFA);

  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  cursor: pointer;
}


.sigin_submit_button button:disabled
{
    background-color: black;
    opacity: 0.5;
    cursor: not-allowed;
}

.signin_button_container p{
  margin: 16px 0px;
  color: var(--subtext-grey-r-text, #71717A);

  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
}

.google_sigin_submit_button button{
  margin-inline: auto;
  display: flex;
  width: 237px;
  padding: 8px 16px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Black, #1C1C1C);
  background-color: white;
  color: var(--black);
  cursor: pointer;
  color: #000;

  font-family: 'Geist-Medium';

  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  cursor: pointer;
}


.register_now_link{
  margin-top: 36px;
  width: 100%;
  display: flex;
  padding: 16px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 10px;
  align-self: stretch;

  border-radius: var(--Border-Radius, 4px);
  background: var(--Hover-BG, #F9F9FA);
  cursor: pointer;
}

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

.register_now_link_header h3{
  color: var(--Black, #1C1C1C);
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 142.857% */
  font-family: 'Geist-Medium';
}


.register_now_link p{
  color: var(--subtext-grey-r-text, #71717A);
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  margin: 0px 0px;
}


.verify_msg_container {
  padding-block: 3rem 1rem;
}

.verify_msg_container h1 {
  margin-bottom: 2rem;
}

.verify_msg_container p {
  margin-bottom: 3.5rem;
}



/* =================Dashboard Page================== */

.dashboardv2_page {
  /* padding: 0px 24px; */
  padding-right: 20px;
}

.manualJournalv2_page {
  padding-right: 20px;
  display: flex;
  flex-direction: column;
  height: 100vh;
  overflow: hidden;
  position: relative;
}

.onboarding_getStarted_btn{
  position:fixed;
  bottom: 30px;
  right: 50px;
  z-index: 999;
}

select{
  appearance: none; /* Remove default appearance */
  -webkit-appearance: none; /* Remove default appearance for WebKit browsers */
  -moz-appearance: none; /* Remove default appearance for Mozilla browsers */
  background-image: url('/assets/images/selectDropdown.svg'); /* Set custom image */
  background-size: 12px; /* Adjust size of the custom image */
  background-repeat: no-repeat; /* Ensure the image is not repeated */
  background-position: right 12px center;
  padding: 8px 32px 8px 16px;
}


.dashboardv2_location_filter select{
  font-size: 12px;
  font-family: 'Geist-Medium';
  padding: 8px 32px 8px 16px;
  appearance: none; /* Remove default appearance */
  -webkit-appearance: none; /* Remove default appearance for WebKit browsers */
  -moz-appearance: none; /* Remove default appearance for Mozilla browsers */
  background-image: url('/assets/images/selectDropdown.svg'); /* Set custom image */
  background-size: 12px; /* Adjust size of the custom image */
  background-repeat: no-repeat; /* Ensure the image is not repeated */
  background-position: right 12px center;
}


.dashboardv2_header{
  padding: 22px 10px 10px 24px;
  /* margin-top: 10px; */
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.dashboardv2_header h1{
  color: var(--Black, #1C1C1C);
  margin-bottom: 0px;
  /* H1/B */
  font-family: 'Geist-Semibold';
  font-size: 24px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 133.333% */
  letter-spacing: -0.144px;
}

.header_divider{
  width: 100%;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
  margin-bottom: 10px;
}


.dashboardv2_filters{
  padding-left: 24px;
  /* margin-top: 8px; */
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}


.dashboardv2_filters_buttons{
  /* margin-top: 8px; */
  display: flex;
  align-items: center;
  gap: 16px;
}






/* ============================= Fitler Dropdown Button ================================== */

.dashboardv2_filter_dropdown {
  position: relative;
}

.dashboardv2_filter_dropdown .toggle_dropdown_btn {
  background-color: #fff;
  color: var(--black, #1C1C1C);
  font-size: 14px;
  height: 37.6px;
  border: 1px solid var(--line-color2);
  padding: 8px 12px;
  border-radius: 4px;
}

.dashboardv2_filter_dropdown .toggle_dropdown_btn img {
  height: 18px;
  width: 18px;
  margin-left: 4px;
}

.dashboardv2_filter_dropdown .toggle_dropdown_btn .selected_count {
  height: 18px;
  width: 18px;
  margin-left: 8px;
  background-color: var(--black);
  color: white;
  font-size: 12px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}


.dropdown_multi_checkboxItems {
  position: absolute;
  top: 100%;
  left: 0;
  width: max-content;
  max-width: 100vw;
}

.dropdown_multi_checkboxItems  {
  position: absolute;
  z-index: 999;
  top: calc(100% + 4px);
  left: 0;
  background-color: #fff;

  max-width: 100vw;
  max-height: 250px;
  overflow-x: visible;
  overflow-y: auto;
  scrollbar-width: none;

  /* border: 1px solid var(--line-color2); */
  border-radius: 10px;
  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
}

.dropdown_multi_checkboxItems .dropdown_item {
  padding: 12px 13px;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0px;
}

.dropdown_multi_checkboxItems .dropdown_item:hover {
  background-color: var(--selected-bg);
}

.dropdown_multi_checkboxItems .dropdown_item p {
  margin: 0px;
}


/* ============================= Fitler Dropdown Button ================================== */






.dashboardv2_custom_datepicker{
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  
  width: max-content;
  border-radius: 4px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
}

.dashboardv2_custom_datepicker p{
  margin-bottom: 0px;
  padding: 8px 16px;
  color: var(--subtext-grey-r-text, #71717A);
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  border-right: 1px solid var(--Stroke--Grey, #E4E4E7);

}



.dashboardv2_custom_datepicker .selected-dates{
  display: flex;
  align-items: center;
  padding: 8px 16px;
}


.dashboardv2_custom_datepicker .selected-dates span{
  margin-bottom: 0px;
  
  color: var(--Black, #1C1C1C);
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  margin-right: 9px;
}

/* ========================= Dayx Custom Date range picker styles. ======================================*/

.daterangepicker:before,
.daterangepicker:after {
  display: none;
}

.daterangepicker {
  max-height: 250px;
  overflow-y: auto;
  scrollbar-width: none;
}

.daterangepicker.show-calendar {
  max-height: fit-content;
}

.daterangepicker .ranges li {
  padding: 10.5px 12px;
  margin: 5px;
  border-radius: 4px;
}

.daterangepicker .ranges li:hover {
  background-color: var(--hover-bg);
}

.daterangepicker .ranges li.active {
  background-color: var(--selected-bg);
  color: var(--black);
  font-weight: bold;
}

.daterangepicker td.in-range {
  background-color: var(--selected-bg);
}

.daterangepicker td.active, 
.daterangepicker td.active:hover {
  background-color: var(--purple-accent);
  border-color: transparent;
  color: #fff;
}

.daterangepicker .drp-buttons .cancelBtn:hover {
  background-color: var(--selected-bg);
  color: var(--black);
}

.daterangepicker.show-calendar .ranges {
  max-height: 296.8px;
  overflow-y: auto;
  scrollbar-width: none;
}

.daterangepicker .btn-primary, 
.daterangepicker .btn-primary:hover {
  color: #fff;
  background-color: var(--black);
  border-color: var(--black);
}

/* .btn-primary:hover {
  color: #fff;
  background-color: var(--purple-accent);
  border-color: var(--purple-accent);
} */

/* ========================= Dayx Date range picker styles. ======================================*/


/* Custom Month Range picker dropdown */

.dashboardv2_custom_datepicker .month-range-popup {
  display: flex;
  overflow: hidden;
  position: absolute;
  top: calc(100% + 5px);
  left: 0;
  /* width: 360px; */
  height: 190px;
  z-index: 999;
  background-color: #fff;
  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  font-size: 12px;
}

.dashboardv2_custom_datepicker .month-range-popup .sort-condition {
  height: 100%;
  flex: 1;
  border-right: 1px solid var(--line-color2);
  min-width: 165px;
}


.sort-condition ul {
  list-style: none;
  padding: 10px;
  margin: 0px;
  height: 100%;
  overflow-y: auto;
}

.sort-condition ul::-webkit-scrollbar {
  width: 5px;
  opacity: 0;
}

.sort-condition ul:hover::-webkit-scrollbar {
  opacity: 1;
}

.sort-condition ul::-webkit-scrollbar-thumb {
  background: var(--selected-bg);
  border-radius: 10px;
}

.sort-condition ul::-webkit-scrollbar-track {
  margin-top: 10px;
  margin-bottom: 10px;
}


.sort-condition ul li {
  padding: 10.5px 12px;
  text-wrap: nowrap;
  white-space: nowrap;
  margin-bottom: 5px;
  border-radius: 5px;
}

.sort-condition ul li {
  background-color: var(--selected-bg);
}

.dashboardv2_custom_datepicker .month-range-popup .month-year-picker {
  height: 100%;
  width: 205px;
}

/* Custom Month Range picker dropdown styles end */


.dashboardv2_search_filter {
  position: relative;
}

.dashboardv2_search_filter .search-icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 12px;
  height: 16px;
  width: 16px;
  color: #71717A;
}

.dashboardv2_search_filter input {
  width: 226px;
  padding: 8px 12px 8px 38px;
}

.dashboardv2_search_filter input::-ms-input-placeholder { /* Edge 12-18 */
  color: #94A3B8;
}

.dashboardv2_search_filter input::placeholder {
  color: #94A3B8;
}


.dashboardv2_location_filter .dropdown button{
  padding: 8px 16px;
  color: var(--Black, #1C1C1C);
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background-color: white;
  font-family: 'Geist-Medium';
  /* box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05); */
}

.switch {
  position: relative;
  display: inline-block;
  width: 42px;
  height: 25px;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: white;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  font-size: 12px;
  height: 19px;
  width: 19px;
  left: 4px;
  top: 2px;
  /* transform: translateY(-50%); */
  background-color: #E4E4E7;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(15px);
  -ms-transform: translateX(15px);
  transform: translateX(15px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}


.dashboardv2_toggle_btn{
  display: flex;
  align-items: center;
  gap: 13px;
}

.dashboardv2_toggle_btn p{
  color: var(--Black, #1C1C1C);

  /* Label */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 142.857% */
}

.dashboardv2_metrics_overflow_container{
  overflow-x: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.dashboardv2_metrics_main_container{
  width: 100%;
  display: flex;
  /* align-items: center; */
  gap: 12px;
  margin-top: 24px;
  /* overflow-x: scroll; */
  -ms-overflow-style: none;
  scrollbar-width: none;
}



.dashboardv2_metrics_container{
  padding-left: 24px;
  min-width: fit-content;
  flex: 1 1 0;
  /* width: 90%; */
  /* width: 90%; */
  display: flex;
  /* overflow-x: scroll; */
  /* align-items: center; */
  gap: 12px;
  
  /* -ms-overflow-style: none; */
  /* scrollbar-width: none; */
}

.dashboardv2_metrics_container::-webkit-scrollbar{
  display: none;
}

.AddMoreMetrics{
  width: 24px;
  /* height: 80px; */
  /* background-color: red; */
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 999;
}

.AddMoreMetrics .icon_divider{
  height: 100%;
  width: 1px;
  background-color: #E4E4E7;
  position: absolute;
  top: 0px;
  left: 50%;
  z-index: 0;
}

.AddMoreMetrics img{
  z-index: 5;
  cursor: pointer;
  padding: 7px 0px;
  background-color: #FAFAFA;
}

.merics_options{
  position: absolute;
  top: 5%;
  right: 100%;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);

  /* Shadow */
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
  width: 230px;
  height: 130px;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
  padding: 0px 0px 10px 0px;
}

.merics_options::-webkit-scrollbar{
  display: none;
}

.merics_options_container{
  padding: 10px 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  width: 100%;
  cursor: pointer;
}

.merics_options_container:hover {
  background-color: var(--hover-bg, #f9f9fa);
}



.dashboardv2_add_widget .open > .dropdown-menu{
  width: 230px;
}

.dashboardv2_add_widget .dropdown-menu{
  right: 0;
  left: auto;
}

.widgets_option{
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  cursor: pointer;
}

.widgets_option:hover {
  background-color: var(--hover-bg, #f9f9fa);
}


.merics_options_container h3, .widgets_option h3{
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Section/Heading */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 18px; /* 228.571% */
  letter-spacing: -0.084px;
  margin-bottom: 0px;
  width: fit-content;
}




.dashboardv2_metrics{
  min-width: calc(25% - 10px);
  /* min-width: 246px; */
  background-color: white;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  padding: 24px;
}

.dashboardv2_metrics_title{
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.dashboardv2_metrics_title h3{
  color: var(--Black, #1C1C1C);
  margin-bottom: 0px;
  /* Section/Heading */
  font-family: 'Geist-Semibold';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 24px; /* 228.571% */
  letter-spacing: -0.084px;
}


.dashboardv2_metrics_percent{
  display: flex;
  align-items: flex-end;
  gap: 1px;
}

.dashboardv2_metrics_percent h1{
  color: var(--Black, #1C1C1C);
  margin-bottom: 0px;
  /* Metric Number */
  font-family: 'Geist-Bold';
  font-size: 24px;
  font-style: normal;
  font-weight: 146;
  line-height: 24px; /* 133.333% */
  letter-spacing: -0.144px;
  margin-top: 16px;
}


.dashboardv2_metrics_percent span{
  color: var(--Black, #1C1C1C);

  /* Chatbot (B) */
  font-family: 'Geist-Bold';
  font-size: 14px;
  font-style: normal;
  font-weight: 146;
  line-height: normal;
}


.dashboardv2_metrics_record span{
  color: var(--subtext-grey-r-text, #71717A);
  display: block;
  /* Section/Sub-Text */
  /* font-family: 'Geist'; */
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-top: 8px;
}

.dashboardv2_widgets_container {
  padding-left: 24px;
}

.dashboardv2_widgets_header{
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 28px;
}

.widget_space{
  display: flex;
  align-items: center;
  gap: 8px;
  

  /* Table/Header */
  /* font-family: ''; */
  
}

.widget_space h3{
  color: var(--subtext-grey-r-text, #71717A);
  font-size: 12px;
  font-style: normal;
  font-weight: 126;
  line-height: normal;
  margin-bottom: 0px;
  font-family: 'Geist-Medium';
}



.dashboardv2_widgets_header_divider{
  flex: 1 1 auto;
  border: 1px solid #E4E4E7;
}


.dashboardv2_add_widget .dropdown button{
  padding: 8px 16px;
  color: var(--Accent, #8617AA);
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background-color: white;
  font-family: 'Geist-Medium';
  /* box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05); */
}

.dashboardv2_add_widget .dropdown button span{
  margin-right: 2px;
}


.dashboardv2_header_container{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: max-content;
  gap: 12px;
}

.dashboardv2_header_container span{
  color: var(--subtext-grey-r-text, #71717A);

  /* Section/Sub-Text */
  /* font-family: Geist; */
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
}

.dashboardv2_header button{
  border-radius: var(--Border-Radius, 4px);
  /* border: none; */
  background: var(--Button-Accent, #1C1C1C);
  padding: 8px 16px;
  color: var(--White-text, #FAFAFA);

  /* Button/primary */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  outline: none;
}

.dashboardv2_header button.button-outline{
  background: transparent;
  color: var(--Button-Accent, #1C1C1C);
  outline: var(--Button-Accent, #1C1C1C);
  border: 1px solid var(--black, #1C1C1C);

  /* font-weight: bold; */
}




/* ===============Dashboard Charts===================== */


.dashboardv2_charts_container{
  width: 100%;
  /* background-color: rgb(248, 39, 39); */
  margin-top: 8px;
  display: flex;
  /* align-items: center; */
  /* flex-wrap: wrap; */
  align-items: stretch;
  gap: 20px;
  padding-left: 24px;
}

.dashboardv2_charts{
  /* flex: 1 0 30%; */
  width: calc(33% - 10px);
  background-color: white;
  padding: 24px;
}


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

.dashboardv2_charts_title{
  display: flex;
  align-items: center;
  gap: 10px;
}

.dashboardv2_charts_header h3{
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Section/Heading */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 228.571% */
  letter-spacing: -0.084px;
  margin-bottom: 0px;
}

.dashboard_graphs_container{
  margin: 20px 0px 11px 0px;
  /* padding: 10px; */
  width: 100%;
  height: 220px;
  /* background-color: #000; */
}


.dashboard_graphs_container canvas{
  width: 100% !important;
}

.dashboard_graphs_legends_container{
  width: 100%;
  border-top: 1px solid var(--Stroke--Grey, #E4E4E7);
  display: flex;
  flex-wrap: wrap;
  column-gap: 16px;
  row-gap: 6px;
  padding: 8px 0px;
}


.dashboard_graphs_legends{
  display: flex;
  align-items: center;
  gap: 6px;
  
}


.dashboard_graphs_legends > div{
  width: 8px;
  height: 8px;
  transform: rotate(-90deg);
  border-radius: 0px 1.538px 1.538px 0px;
}


.dashboard_graphs_legends p{
  overflow: hidden;
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Chart content(r) */
  font-family: 'Geist-Light';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
}






.dayx_dashboard_table{
  /* flex: 1 0 55%; */
  width: 55%;
  height: 350px;
  padding-bottom: 0px !important;
  max-width: 100%;
}

.dayx_dashboard_table_tabs{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 11px;
}

.viewFullReport p{
  color: var(--Accent, #8617AA);

  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  margin-bottom: 0px;
  cursor: pointer;
}

.dashboard-table-container {
  padding-top: 1rem;
  background-color: #fff;
  width: 100%;
  height: 243px;
}

.dashboard-table-container .table-wrapper::-webkit-scrollbar {
  display: none;
}


.dayx_dashboard_insights{
  /* width: calc(20% - 10px); */
  width: calc(35% - 10px);
  flex: 1 1 33%;
  height: 350px;
  overflow-y: scroll;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.dayx_dashboard_insights::-webkit-scrollbar{
  display: none;
}


.dayx_dashboard_insights_container{
  margin-top: 11px;
}

.insights_container{
  padding: 10px 0px;
  display: flex;
  gap: 24px;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.insight_title{
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.insight_title h3{
  color: var(--Black, #1C1C1C);

  /* Table/Content(B) */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-bottom: 0px;
}


.insight_title span{
  overflow: hidden;
  color: var(--subtext-grey-b-text, #94A3B8);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Chart Small */
  font-family: 'Geist-Regular';
  font-size: 10px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 15px */
  letter-spacing: -0.06px;
}

.insight_details {
  width: 100%;
}

.insight_descrip{
  width: 100%;
  overflow: hidden;
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  margin-top: 10px;
}


/* ====================== Reports Page =========================== */
.reports_page_container {
  width: 100%;
  display: flex;
  gap: 14px;
  padding: 0px 24px 24px 24px;
}

.reports_page_container .h-text {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 10px;
}

.reports_page_container .description_text {
  font-size: 12px;
  margin: 0px;
  color: var(--subtext-grey-r-text);
}

.reports_page_container .reports_tables_container{
  flex: 1;
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 50%;
}

.reports_tables_container .reports_table .reports_list,
.reports_tables_container .reports_table .header_row {
  background-color: white;
}

.reports_tables_container .reports_table .header_row {
  padding: 16px 20px 24px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.reports_tables_container .reports_table .header_row .dropdown-icon {
  transition: var(--trans-03);
}

.reports_tables_container .reports_table .header_row .dropdown-icon.collapsed {
  transform: rotate(-180deg);
}

.reports_tables_container .reports_table .reports_list {
  padding: 10px 0px;
  border-top: 1px solid var(--line-color2);
}

.reports_list .report_link_wrapper {
  padding: 12px 20px 12px 16px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.report_name_wrapper {
  display: flex;
  align-items: center;
  gap: 10px;
}

.report_link_wrapper .icon-wrapper {
  padding: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.report_link_wrapper .icon-wrapper img {
  height: 16px;
  width: 16px;
}

.favorites-select {
  position: relative;
  height: 16px;
  width: 16px;
}


.favorites-select input {
  position: absolute;
  height: 100%;
  width: 100%;
  opacity: 0;
  margin: 0px;
  z-index: 99;
  cursor: pointer;
}

.favorites-select svg {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.favorites-select.is-selected svg {
  fill: #EDBF31;
}

.favorites-select.is-selected svg path {
  stroke: #EDBF31;
}

.reports_page_container .reports_favorites{
  border-radius: 5px;
  background: var(--White-BG, #FFF);
  padding: 24px;
  margin-top: 10px;
  width: 358px;
  height: max-content;
  gap: 14px;
}

.reports_favorites .favorite_report_wrapper {
  margin: 15px 0px;
  padding: 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}


/* Accordion Collapsible */
.accordion_collapsible {
  max-height: 100%;
  box-sizing: border-box;
  overflow: hidden;
  transition: var(--trans-03);
}

.accordion_collapsible.collapsed {
  max-height: 0px;
  padding: 0px !important;
  border: none !important;
  transition: var(--trans-03);
}

/* =================Add Transaction Modal=================== */

.modal-fit-content .modal-dialog {
  width: auto;
  max-width: 708px;
  border-radius: 10px;
}

.addTransactionModal_container{
  width: 706px;
  
}


.addTransactionModal_container .modal-body{
  width: 100%;
}

.addTransactionModal_header{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 24px;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.addTransactionModal_header h1{
  color: var(--Black, #1C1C1C);

  /* H1/B */
  font-family: 'Geist-Medium';
  font-size: 24px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 133.333% */
  letter-spacing: -0.144px;
  margin-bottom: 0px;
}

.dayx_modal form{
  padding: 16px 24px 48px 24px;
   border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.dayx_form_input_container{
  display: flex;
  align-items: center;
  gap: 34px;
  margin-bottom: 8px;
}

.ctc_form_input_container {
  display: flex;
  align-items: center;
  gap: 34px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}

.form_input{
  width: calc(50% - 12px);
}

.ctc_form_input_container .form_input {
  width: calc(50% - 17px);
}

.form_input label {
  font-family: 'Geist-Medium';
}

.form_input input,select{
  width: 100%;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: #FFF;
  color: var(--Black, #1C1C1C);
  text-overflow: ellipsis;
  padding: 8px 12px;
  /* Label */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 142.857% */
  outline: none;

  

}

.form_input input[disabled] {
  opacity: .7;
}

.form_input select{
  appearance: none; /* Remove default appearance */
  -webkit-appearance: none; /* Remove default appearance for WebKit browsers */
  -moz-appearance: none; /* Remove default appearance for Mozilla browsers */
  background-image: url('/assets/images/selectDropdown.svg'); /* Set custom image */
  background-size: 16px; /* Adjust size of the custom image */
  background-repeat: no-repeat; /* Ensure the image is not repeated */
  background-position: right 12px center;
}

.dayx_modal label{
  color: #0F172A;

  /* Label */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 142.857% */
}

.addCustomer_addVendor{
  display: flex;
  gap: 8px;
  align-items: center;
  color: var(--Accent, #8617AA);
}

.addCustomer_addVendor p{
  
  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  margin-bottom: 0px;
}

.dayModal_Notes{
  width: 100%;
  margin-top: 32px;
}

.dayModal_Notes input{
  width: 100%;
}

.dayxModal_Submit{
  padding: 16px 24px;
  text-align: end;
}

.dayxModal_Submit button{
  border-radius: var(--Border-Radius, 4px);
  background: var(--Button-Accent, #1C1C1C);
  padding: 8px 16px;
  color: var(--White-text, #FAFAFA);

  /* Button/primary */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
}



/* ===================Create New Options==================== */

.create_newOptions_container{
  position: relative;
  z-index: 999;
  
}



.createNewOption_container{
  width: fit-content;
  padding: 36px 36px;
  background-color: white;
  border-radius: 10px;
  position: relative;
  left: 100px;
  position: absolute;
  top: -50%;
  left: calc(100% + 42px);
  z-index: 999;
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.creaNewOption_tooltip svg{
  position: absolute;
  width: 39px;
  height: 45px;
  /* transform: rotate(-90deg); */
  flex-shrink: 0;
  fill: #FFF;
  /* background-color: white; */
  right: 98%;
  top: 32px;
  
}

.options_container{
  display: flex;
  justify-content: space-evenly;
  gap: 32px;
  align-items: flex-start;
}

.options_container h3{
  color: var(--Black, #1C1C1C);

  /* Nav item (B) */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: normal;
  margin-bottom: 0px;
}

.options_list{
  display: flex;
  flex-direction: column;
  
}

.options_list p{
  width: 161px;
  margin-top: 20px;
  white-space: nowrap; /* Prevent text from wrapping */
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  margin-bottom: 0px;
 
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  cursor: pointer;
}

/* ==============Income Statement==================== */

.incomestatement_toggle {
  margin-top: 48px;
  margin-bottom: 48px;
  /* display: flex;
  justify-content: center; */
  position: relative;
}

.coa_mapped_toggle {
  margin-top: 24px;
  margin-bottom: 24px;
  position: relative;
}

.incomestatement_toggle_container{
  padding: 5px;
  background-color: white;
  border-radius: 4px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  /* transform: translateY(-50%); */
}

.incomestatement_toggle_container button{
  padding: 6px 12px;
  /* color: var(--Black, #1C1C1C); */
  /* background-color: transparent; */

  /* Table/Content(B) */
  font-family: 'Geist-REgular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  border: none;
  outline: none;
  border-radius: 3px;
}

.btn-expanded{
  background-color: #F4F4F5;
  color: #1C1C1C;
}

.btn-clicked{
  background-color: white;
  color: #71717A;
}

.toggle_divider{
  min-width: 100%;
  height: 1px ;
  background-color: #E4E4E6;
}



/* =================Modal======================= */

.modal.in .modal-dialog{
  border-radius: 10px;
}

.panel{
  margin-bottom: 0px;
}

.panel-heading{
  padding: 16px 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.panel-default > .panel-heading{
  background-color: white;
}

.panel-body{
  padding: 16px 24px;
}

.panel-footer{
  background-color: white;
  border-top: 1px solid var(--Stroke--Grey, #E4E4E7);
  display: flex;
  justify-content: flex-end;
}

.panel-footer button{
  width: max-content;
}

.custom-select{
  padding: 8px 12px;
  height: fit-content;
}

.modal-content{
  border-radius: 10px;
}









/* ================forecastingv2 Page==================== */

.forecastingv2_select .chosen-container{
  width: fit-content !important;
}

.forecastingv2_page{
  width: 100%;
}

.forecastingv2_page_header{
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 22px 24px 10px 24px;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
  
}

.forecastingv2_page_title{
  display: flex;
  align-items: center;
}

.forecastingv2_page_title h1{
  color: var(--Black, #1C1C1C);

  /* H1/B */
  font-family: 'Geist-Medium';
  font-size: 24px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 133.333% */
  letter-spacing: -0.144px;
  /* margin-left: 12px; */
  margin-bottom: 0px;
}

.forecastingv2_page_title span{
  color: var(--subtext-grey-r-text, #71717A);

  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  /* margin-left: 24px; */
}

.forecastingv2_page_btns{
  display: flex;
  align-items: center;
}

.forecastListv2_filters{
  padding: 0px 24px 24.5px;
  /* margin-top: 8px; */
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}


.forecastListv2_filters_buttons{
  margin-top: 8px;
  display: flex;
  align-items: center;
  gap: 16px;
}

.dateRange_picker{
  display: flex;
  align-items: center;
}

.dateRange_picker p{
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  margin-bottom: 0px;
}
.dateRange_picker .datePicker{
  width: 235px;
  height: 33px;
  border-radius: var(--Border-Radius, 4px);

  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  margin-left: 16px;
}

.forecastingv2_page_btns button{
  margin-left: 20px;
}


.forecastingv2_page_container{
  width: 100%;
  display: flex;
  gap: 14px;
  padding: 0px 24px 24px 24px;
}


.forecastingv2_page_container .forecastingv2_feature{
  /* height: 100%; */
  border-radius: 10px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  padding: 16px;
  margin-top: 10px;
  width: 358px;
}

.forecastingv2_page_container .forecastingv2_feature.inactive {
  background: var(--selected-bg);
  display: flex;
  justify-content: center;
  align-items: center;
  height: 75vh;
}

.forecastingv2_page_container .forecastingv2_feature .no-data-info {
  font-size: 16px;
  font-weight: bold;
  color: #94A3B8;
  line-height: 32px;
  text-align: center;
  padding: 0px 20px;
  margin: 0px;
}



.forecastingv2_page_container .forecastListv2_feature{
  /* border-radius: 10px; */
  background: var(--White-BG, #FFF);
  padding: 16px;
  margin-top: 10px;
  min-width: 358px;
}


.forecastingv2_page_container .forecastingv2_table{
  flex: 1;
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  width: 50%;
}

.forecastingv2_page_container .forecastListv2_table{
  flex: 1;
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  width: 50%;
  height: 100vh;
}

.forecastingv2_feature_header{
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
  padding: 10px 10px 10px 0px;
}

.forecastingv2_feature_header h3{
  color: #000;
  text-align: left;
  leading-trim: both;
  text-edge: cap;

  /* Section/Heading */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 20px; /* 228.571% - IDK what this % is about changed value from 32px*/
  letter-spacing: -0.084px;
  margin: 0px 5px 0px 0px; 
}

.forecastingv2_feature_header .save_btn {
  display: flex;
}

.forecastingv2_feature_header button{
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Accent, #8617AA);
  background: var(--White-BG, #FFF);
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);

  color: var(--Accent, #8617AA);

  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  padding: 8px 12px;
  margin-right: 8px;
}

/* .forecastingv2_item_list_container {
  display: flex;
  flex-direction: column;
  justify-content: center;
} */

.edit_list_btns_container {
  display: flex;
  justify-content: center;
  margin-bottom: 8px;
}

.edit_list_btns_container .list_edit_btn {
  color: #94A3B8;
  border: 1px solid #94A3B8;
  border-radius: 4px;
  padding: 2px 5px;
  margin: 0px 2px;
  background-color: white;
}

.list_edit_btn img {
  height: 16px;
  width: 16px;
  margin-bottom: 2px;
  margin-right: 2px;
}

.forecastingv2_item_card {
  margin-bottom: 8px;
  padding: 8px 12px;
  border: 1px solid var(--line-color);
  border-radius: 5px;
  width: 100%;
  display: flex;
  align-items: center;
}

.forecastingv2_item_card .card_details {
  flex: 1;
}

.forecastingv2_item_card .card_details .item_name {
  margin: 0px;
  padding-bottom: 10px;
}

.forecastingv2_item_card .item_description {
  font-size: 12px;
  font-family: 'Geist-Light';
  color: #94A3B8;
  margin: 0px;
  letter-spacing: .9px;
}

.forecastingv2_item_card .card_action_btn_container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 38px;
  width: 38px;
}

.forecastingv2_item_card .card_action_btn_container img {
  height: 20px;
  width: 20px;
}


.forecastingv2_no_item_info_container {
  height: 400px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.forecastingv2_no_item_info_container span {
  padding: 10px 0px;
  font-size: 12px;
  font-weight: bold;
}


.button_not_button {
  background-color: transparent;
  color: var(--black);
  border: none;
  font-weight: bold;
}


.forecastingv2_feature_container .add_more_forecast_periods {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  padding: 6px 0px;
}

.forecastingv2_feature_container .add_more_forecast_periods .add_btn {
  z-index: 5;
  cursor: pointer;
  padding: 0px 7px;
  background-color: #FFF;
}

.forecastingv2_feature_container .add_more_forecast_periods .icon_divider_horizontal {
  width: 100%;
  height: 1px;
  background-color: #E4E4E7;
  position: absolute;
  top: 50%;
  left: 0px;
  z-index: 0;
}



.note p {
  color: var(--subtext-grey-b-text, #94A3B8);
  leading-trim: both;
  text-edge: cap;

  /* Chart Small */
  font-family: 'Geist-Light';
  font-size: 11px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%;
  letter-spacing: 0.3px;
  padding: 10px 0px;
}


.periodicity{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 8px;
}

.accordian_label{
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;

  /* Chart content(b) */
  font-family: 'Geist-Medium';
  font-size: 12px;
  font-style: normal;
  font-weight: 126;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  width: fit-content;
}

.periodicity select{
  width: fit-content;
  padding: 8px 12px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: #FFF;
}

.forecastingv2_feature_accordian_container{
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 8px;
}

.forecastingv2_feature_accordian{
  width: 100%;
  
  background: #FFF;
  /* Shadow */
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.forecastingv2_feature_accordian_header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  cursor: pointer;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.forecastingv2_feature_accordian.active .forecastingv2_feature_accordian_header {
  background: rgba(228, 228, 231, 0.30);
}

.forecastingv2_feature_accordian h3{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Table/Header */
  font-family: 'Geist-Medium';
  font-size: 12px;
  font-style: normal;
  font-weight: 126;
  line-height: normal;
  margin-bottom: 0px;
  margin-top: 0px;
}

.forecastingv2_feature_accordian_body{
  overflow: hidden;
  width: 100%;
  height: 0px;
  transition: height var(--trans-03);
}

.forecastingv2_feature_accordian.active .forecastingv2_feature_accordian_body {
  overflow: visible;
  padding: 16px;
  height: 100%;
  transition: height var(--trans-03);
}

.forecastingv2_accordian_filters{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 8px;
}

.forecastingv2_accordian_filters .fit_content{
  max-width: fit-content;
}

.forecastingv2_accordian_filters .chosen-container {
  width: fit-content !important;
}

.toggle_value{
  padding: 3.5px;
  border-radius: 2.848px;
  background: #F4F4F5;

  /* Shadow */
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
}

.toggle_value .value_by{
  padding: 4px 8px;
  cursor: pointer;
  border-radius: 2.136px;
}


.toggle_value .value_by.active{
  background-color: white;
  /* Shadow */
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
}

.vale_by_input{
  width: 98px;
}

.advance_filter{
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-top: 8px;
  gap: 6px;
  cursor: pointer;
}

.advance_filter h3{
  color: var(--Accent, #8617AA);

  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  margin-bottom: 0px;
}

.border_div{
  border-left: 1px solid #E4E4E7;
  border-right: 1px solid #E4E4E7;
}

.budgeting_plan_details_container{
  width: 100%;
  background-color: white;
  
  display: flex;
  align-items: center;
  
  /* justify-content: space-between; */
  padding:10px 20px;
}

.budgeting_plan_details span{
  color: var(--subtext-grey-r-text, #71717A);

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
}


.budgeting_plan_details_container button{
  padding: 8px 12px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Accent, #8617AA);
  background: var(--White-BG, #FFF);
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
  font-size: 12px;
  color: var(--Accent, #8617AA);
  font-family: 'Geist-Regular';
  width: fit-content;
  white-space: nowrap;
}

.budgeting_plan_details_container .budgeting_plan_details{
  padding: 0px 20px;
  /* width: 225px; */
  width: 30%;
}

.budgeting_plan_details span{
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
}


.budgeting_plan_details p{
  overflow: hidden;
  white-space: nowrap;
  color: var(--Black, #1C1C1C);
  text-overflow: ellipsis;

  /* Table/Content(B) */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-top: 6px;
}


.forecastingv2Tabs_Tables{
  padding: 10px;
  width: 100%;
  background-color: white;
  margin-top: 10px;
}


.forecastingv2_tabs_container{
  display: flex;
  width: fit-content;
  align-items: center;
  padding: 0px 3px;
  border-radius: 5px;
  box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.05);
}

.forecastingv2_tabs{
  padding: 7.5px 12px;
  overflow: hidden;
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;
  text-align: center;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  margin: 5px 2px;
  cursor: pointer;
}

.forecastingv2_tabs.active{
  border-radius: 3px;
  font-family: 'Geist-Medium';
  background: rgba(134, 23, 170, 0.20);
  color: var(--Accent, #8617AA);

}


.forecastingv2_filters{
  display: flex;
  align-items: center;
  gap: 16px;
  justify-content: space-between;
  margin-top: 29px;
}


.forecastingv2_filters .dashboardv2_location_filter{
  width: fit-content;
}

.custom_width_chosen_container .chosen-container {
  width: 100% !important;
}

.forecastingv2_filters .incomestatement_toggle_container{
  position: relative;
  top: 0px;
  left: 0px;
  transform: translate(0px, 0px);
}

.dayx_description{
  margin-top: 25px;
}
.dayx_description textarea{
  width: 100%;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: #FFF;
  padding: 8px 12px;
  font-size: 14px;
  outline: none;
  line-height: 20px;
  font-family: 'Geist-Regular';
}





/* ====================Chatbot Page====================== */

.chatbotpage .dashboardv2_header{
  padding: 12px 24px 10px 24px;
}

.chatbotpage_container{
  padding: 6px 20px 0px 20px;
  display: flex;
  gap: 10px;
  height: calc(100vh - 78px);
  position: relative;
}


.chatbotpage_body{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  flex: 1 0 0;
  align-self: stretch;
  background: var(--White-BG, #FFF);
}

.chatbot_history{
  display: flex;
  width: 323px;
  padding: 24px 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  align-self: stretch;
  border-right: 1px solid var(--Stroke--Grey, #E4E4E7);
background: var(--White-BG, #FFF);
}

.chatbot_history .chatbot_history_header{
  padding-bottom: 24px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.chatbot_history .chatbot_history_header h3{
  color: #000;
  leading-trim: both;
  text-edge: cap;

  /* Section/Heading */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 228.571% */
  letter-spacing: -0.084px;
}
.chatbot_history_details_container{
  width: 100%;
}

.chatbot_history_details{
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  margin-top: 16px;
}


.chatbot_history_details h3{
  color: var(--subtext-grey-b-text, #94A3B8);

  /* Table/Content(B) */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-bottom: 4px;
}

.chatbot_history_questions{
  width: 100%;
  padding: 10px 12px;
  border-radius: 4px;
  background: var(--Hover-BG, #F9F9FA);

}

.chatbot_history_questions p{
  margin-bottom: 0px;
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
}


.chatbotpage_body{
  padding: 24px 24px 0px 24px;
  height: calc(100vh - 78px);
  position: relative;
  overflow-y: auto;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;
}

.chatbotpage_body::-webkit-scrollbar{
  display: none;

}





.chatbot_question_submit{
  width: 100%;
  display: flex;
  gap: 24px;
  /* background-color: #000; */
  position: sticky;
  bottom: 0px;
  left: 0px;
  z-index: 999;
  padding: 10px;
  
}

.chatbot_question_submit input{
  display: flex;
  height: 36px;
  padding: 10px 12px;
  flex: 1 1 auto;
  align-self: stretch;
}

.question_submit_button{
  cursor: pointer;
  display: flex;
  width: 38px;
  height: 36px;
  padding: 10px 12px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: var(--Border-Radius, 4px);
background: var(--Black, #1C1C1C);
box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05);
}


.chabot_conversations_container{
  width: 100%;
  display: flex;
  /* flex-direction: column-reverse; */
  /* justify-content: flex-end; */
  /* background-color: rgb(214, 209, 209); */
  /* gap: 24px; */
  /* height: calc(100vh - 100px);
  max-height: calc(100vh - 100px); */
  overflow-y: scroll;
  -ms-overflow-style: none;  
  scrollbar-width: none;
}

.chabot_conversations_container::-webkit-scrollbar{
  /* display: none; */
}

.chatbot_convo_container{
  width: 100%;
  height: 100%;
  /* background-color: blue; */
  display: flex;
  flex-direction: column;
 
  /* justify-content: flex-end; */
  align-items: flex-end;
  overflow-y: scroll;
  -ms-overflow-style: none;  
  scrollbar-width: none;
  gap: 24px;
}

.chatbot_convo{
  width: 100%;
  height: 100%;
  display: flex;
 
  flex-direction: column;
  align-items: flex-end;
  /* overflow-y: scroll;
  -ms-overflow-style: none;  
  scrollbar-width: none; */
}

.chatbot_convo::-webkit-scrollbar{
  /* display: none; */
}

.chabot_conversations{
  display: flex;
  gap: 13px;
  align-items: flex-start;
  width: 100%;
}

.chatbot_conversation_details{
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
}

.chatbot_user{
  display: flex;
  gap: 10px;
  width: 100%;
  align-items: center;
}

.chatbot_user h4{
  color: #000;
  leading-trim: both;
  text-edge: cap;

  /* Table/Header */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 126;
  line-height: normal;
  width: fit-content;
  margin-bottom: 0px;
}

.chatbot_user .chabot_user_divider{
  display: flex;
  flex: 1 1 0;
  height: 1px;
  background-color: #E4E4E7;
  /* width: 100%; */
}

.chatbot_user_question{
  padding:16px 20px;
}

.chatbot_user_question p{
  color: #000;
  leading-trim: both;
  text-edge: cap;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  margin-bottom: 0px;
}


.chatbot_report_img{
  margin: 10px 0px;
}


.viewBydropdown{
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  width: fit-content;
  cursor: pointer;
  position: relative;
}

.select_dropdown_img{
  width: 12px;
  height: 12px;
}

.dropDown_options_container{
  position: absolute;
  top: 102%;
  left: 0px;
  z-index: 999;
  width: 125px;
  height: auto;
  border-radius: 4px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);

  /* Shadow */
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);

}

.share_options_container{
  right: 100%;
  left: auto;
}

.dropDown_options{
  padding: 10px 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  cursor: pointer;
  min-width: fit-content;
}

.dropDown_options_container p{
  width: fit-content;
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
}


.share_icon_container{
  position: relative;
}


/* ==============Personnel Overview================= */

.personnel_overview{
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.personnel_overview .dashboardv2_metrics_container{
  padding:0px 24px;
}

.dashboardv2_metrics_title{
  gap: 8px;
}


.personnel_graph_payrun_container{
  display: flex;
  align-items: flex-start;
}

.personnel_graph_payrun_container{
  width: 100%;
  flex: 1 1 0;
  margin-top: 24px;
  display: flex;
  gap: 20px;
  padding: 0px 24px;
}


.personnel_graph_container{
  width: 60%;
  height: 100%;
  /* max-width: 700px; */
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  padding: 21px 24px;
}

.personnel_payrun_container{
  width: 40%;
  height: 100%;
  padding: 24px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
}

.personnel_graph_container .dashboardv2_filters_buttons{
  width: 100%;
  flex-wrap: wrap;
}


.payrun_cards_container{
  margin-top: 11px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.payrun_cards{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px;
  border-radius: 10px;
  border: 1px solid #E4E4E7;
  background: var(--White-BG, #FFF);
  cursor: pointer;
}

.payrunDate h3{
  color: var(--Black, #1C1C1C);
  text-align: right;
  leading-trim: both;
  text-edge: cap;

  /* Section/Heading */
  font-family: 'Geist-SemiBold';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 228.571% */
  letter-spacing: -0.084px;
  margin-bottom: 0px;
}

.payrunDate p{
  color: var(--Green, #18AF66);

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
  margin-top: 6px;
}

.payPeriod h4{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Chart content(b) */
  font-family: 'Geist-SemiBold';
  font-size: 12px;
  font-style: normal;
  font-weight: 126;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
}

.payPeriod p{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Chart content(r) */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
  margin-top: 6px;
}



.personnel_graphs{
  display: flex;
  gap: 20px;
  margin-top: 16px;
}

.personnel_actual_payroll_graph{
  width: calc(50% - 10px);
  background: var(--White-BG, #FFF);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.personnel_actual_graph{
  width: 100%;
  /* height: 50%; */
  padding: 16px 16px 0px 16px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.personnel_payroll_graph{
  width: 100%;
  /* height: 50%; */
  padding: 16px 16px 0px 16px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-radius: 4px;
}

.personnel_overview_graph{
  width: calc(50% - 10px);
  /* height: 377px; */
  padding: 16px 16px 0px 16px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-radius: 4px;
}

.personnel_charts{
  flex: 1 1 0;
  width: 100%;
  height: 120px;
  margin-top: 10px;
}
.overview_chart{
  width: 100%;
  /* flex: 1 1 0; */
  height: 220px;
}
/* .personnel_charts canvas{
  height: 100% !important;
  width: auto !important;
} */

.personnel_legends{
  width: 100%;
  /* height: 30px; */
  border-top: 1px solid var(--Stroke--Grey, #E4E4E7);
  /* background-color: #000; */
  padding: 8px 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.personnel_table{
  width: 100%;
  height: 300px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  margin-top: 12px;
  border-radius: 4px;
  padding: 24px;
}


.full_report_link{
  display: flex;
  gap: 9px;
  align-items: center;
}


.full_report_link p{
  color: var(--Accent, #8617AA);

  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  margin-bottom: 0px;
  line-height: 20px; /* 166.667% */
  cursor: pointer;
}


/* ================Employee ================== */

.employee_filter_container{
  width: 100%;
  padding: 8px 12px;
  background-color: white;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
}

.employee_search_input{
  flex: 1 1 0;
  position: relative;
}

.employee_search_input img{
  position: absolute;
  top: 49%;
  left: 12px;
  transform: translateY(-50%);
}

.employee_search_input input{
  width: 100%;
  max-width: 250px;
  padding: 8px 12px 8px 34px;
}

.employee_filter_container .dashboardv2_filters_buttons{
  margin-top: 0px;
}

.employee_table_container {
  background-color: white;
  margin-top: 16px;
  padding-top: 24px;
  width: 100%;
  display: flex;
  justify-content: center;
  height: 100vh;
}

.employee_table_container .table-wrapper {
  min-width: 80%;
}

.employee_table_container .table-wrapper table {
  max-width: 750px;
}

.table_actions{
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: 20px;
}

.table_actions svg{
  cursor: pointer;
}


/* ===========Create Employee Sliding window================== */

.slidingWindow_container{
  position: relative;
  overflow-x: hidden;
}


.submitBtn_container{
  position: absolute;
  bottom: 0px;
  left: 0px;
  border-top: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  padding: 16px 24px;
  width: 100%;
  display: flex;
}

.submitBtn_container button{
  margin-left: auto;
  min-width: fit-content;
  width: 136px;
}


.employee_slider {
  width: 700px;
  height: 100%;
  background-color: #f0f0f0;
  position: absolute;
  top: 0;
  right: -724px; /* extra -24px to hide box-shadow - you may change if you have better option to hide the shadow */
  transition: right 0.5s;

  border-radius: 10px;
  background: var(--White-BG, #FFF);
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.employee_slider.slide-out {
  right: 0;
}

.slidingWindow{
  width: 100%;
  height: 100%;
}

.slidingWindow_header{
  padding: 16px 24px;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.slidingWindow_header h2{
  color: var(--Black, #1C1C1C);

  /* H1/B */
  font-family: 'Geist-SemiBold';
  font-size: 24px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 133.333% */
  letter-spacing: -0.144px;
  margin-bottom: 0px;
}

.slidingWindow_header svg{
  cursor: pointer;
  outline: none;
}


.slidingWindow_Body{
  padding: 15px 24px 15px 24px;
  height: calc(100vh - 65px);
  overflow-y: scroll;
  -ms-overflow-style: none;  
  scrollbar-width: none;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.createEmployee_slider{
  padding: 15px 24px 82px 24px;
}

.slidingWindow_Body::-webkit-scrollbar{
  display: none;
}

.empolyeeBasicDetails_accordian{
  /* height: 200px; */
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.empolyeeBasicDetails_accordian_header{
  padding: 8px 12px;
  /* border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7); */
  background: #F7F7F8;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}

.empolyeeBasicDetails_accordian_header h3{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Table/Header */
  font-family: 'Geist-Medium';
  font-size: 12px;
  font-style: normal;
  font-weight: 126;
  line-height: normal;
  margin-bottom: 0px;
}

.empolyeeBasicDetails_accordian_body{
  padding: 16px 24px;

}

.chosen-container-single .chosen-single{
  box-shadow: none;
}

.payrollTabs{
  position: relative;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  width: 100%;
  /* height: 400px; */
  min-height: 100px;
  border-radius: 4px;
  margin-top: 32px;
}

.payrollTabs .incomestatement_toggle_container{
  top: 0%;
  left: 20px;
  transform: translateY(-50%);
  background-color: #F4F4F5;
}

.component_tab_details{
  padding: 24px;
  margin-top: 12px;
}

.component_tab_details .form_input{
  display: flex;
  gap: 12px;
}

.component_tab_details .form_input .normal_input_container{
  flex: 1 1 0;
}

.component_tab_details .form_input .percent_container{
  width: 75px;
}

.addCTCComp{
  display: flex;
  align-items: center;
  gap:6px;
  cursor: pointer;
}

.addCTCComp p{
  margin-top: 8px;
  color: var(--Accent, #8617AA);

  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
}

/* =============edit employee ====================== */

.editEmployeeTabs_container{
  width: 100%;
  height: 100%;
  border-radius: 10px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  margin-top: 32px;
  position: relative;
  display: flex;
  flex-direction: column;
}

.editEmployeeTabs_container .forecastingv2_tabs_container{
  background-color: #F4F4F5;
  padding: 5px;
  position: absolute;
  top: 0%;
  transform: translateY(-50%);
  left: 32px;
}

.parentTab_container .forecastingv2_tabs_container{
  background-color: #F4F4F5;
  padding: 5px;
}

.editEmployeeTabs_container .forecastingv2_tabs_container{
  box-shadow: none;
}

.editEmployeeTabs_container .forecastingv2_tabs{
  margin: 0px;
  min-width: 100px;
}

.parentTab_container .forecastingv2_tabs_container{
  margin-top: 0px;
}

.editEmployeeTabs_container .forecastingv2_tabs.active{
  background-color: white;
  color: #1C1C1C;
  font-family: 'Geist-Medium';
}

.parentTab_container .forecastingv2_tabs_container{
  background-color: white;
  color: #1C1C1C;
  font-family: 'Geist-Medium';
}

.editEmployee_basicDetails{
  padding: 0px 24px;
  margin-top: 32px;
  width: 100%;
}

.editEmployeeTabs_container_button{
  padding: 10px;
  text-align: end;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.editEmployeeTabs_container_button p{
  margin-left: auto;
}

.save_edit_button{
  margin-left: auto;
  width: fit-content;
  display: flex;
  gap: 12px;
  align-items: center;
}

.save_edit_button p{
  color: var(--Accent, #8617AA);

  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  margin-bottom: 0px;
}

.save_edit_button button{
  min-width: fit-content;
}

.editEmployeeTabs_container_button button{
  margin-left: auto;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Button-Accent, #1C1C1C);
  display: flex;

  min-width: fit-content;
  height: 36px;
  padding: 8px 16px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  background-color: white;
  color: var(--Button-Accent, #1C1C1C);

  /* Button/primary */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
}

.editEmployee_basicDetails{
  flex: 1 1 0;
  display: flex;
  flex-direction: column;

}

.employee_basiDetails_formContainer{
  flex: 1 1 0;
  width: 100%;
  overflow-y: scroll;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;
  padding: 12px 24px;
}

.employee_basiDetails_formContainer::-webkit-scrollbar{
  display: none;
}

.employee_basiDetails_formContainer form{
  width: 100%;
}



.editEmployee_payslip{
  padding: 12px 24px;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.editEmployee_payslip_filter{
  margin-top: 32px;
}




.payslip_card_container{
  flex: 1 1 0;
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  
  overflow-y: scroll;
  /* background-color: red; */
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.payslip_card_container::-webkit-scrollbar{
  display: none;
}

.payslip_card{
  border-radius: 10px;
  border: 1px solid #E4E4E7;
  background: var(--White-BG, #FFF);
  padding: 16px 20px 16px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.payslip_details h3{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Section/Heading */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 228.571% */
  letter-spacing: -0.084px;
  margin-bottom: 0px;
}

.payslip_details p{
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
  /* margin-top: 10px; */
}

.viewPdf p{
  color: var(--Green, #18AF66);
  leading-trim: both;
  text-edge: cap;

  /* Chart content(r) */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
  cursor: pointer;
}

.chosen-container{
  width: 100% !important;
}

.editEmployee_payroll{
  padding: 24px;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.payroll_accordian_container{
  margin-top: 30px;
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.payroll_accordian_container::-webkit-scrollbar{
  display: none;
}

.payroll_accordian{
  border-radius: var(--Border-Radius, 4px);

  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  
}

.payroll_accordian_header{
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  padding: 10px 20px;
}

.payroll_accordian_header h3{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Chart content(b) */
  font-family: 'Geist-Medium';
  font-size: 12px;
  font-style: normal;
  font-weight: 126;
  line-height: 13px; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 8px;
}

.payroll_accordian_header p{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Chart content(r) */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 13px; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
}

.payroll_status_container{
  display: flex;
  align-items: center;
  gap: 20px;
}

.payroll_status_container p{
  color: var(--Green, #18AF66);

  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  margin-bottom: 0px;
}

.addNewPayroll p{
  color: var(--Accent, #8617AA);

  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  margin-bottom: 0px;
  cursor: pointer;
}

.payroll_accordian_header.open {
  border-radius: var(--Border-Radius, 4px);
border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
background: var(--Selected-BG, #F4F4F5);
}


.payroll_warning{
  display: flex;
  align-items: center;
  gap: 4px;
}

.payroll_warning p{
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;

  /* Chart content(r) */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
}

.disabled-label {
  color: var(--subtext-grey-r-text, #71717A);
}


/* ==============Payrun Date Details=============== */

.payrunDateDetails_page_container{
  display: flex;
  flex-direction: column;
  height: 100vh;
}

.payrunDateDetails_page_container .dashboardv2_header{
  padding: 10px 24px;
}   

.payrun_Filters_container{
  margin-top: 16px;
  /* padding: 0px 24px; */ 
}

.payrun_Filters{
  /* border-radius: 10px; */
  background: var(--White-BG, #FFF);
  display: flex;
  justify-content: space-between;
  padding: 10px 24px;
  align-items: center;
}

.payrun_Filters .dayx_form_input_container{
  width: 500px;
  gap: 16px;
}

.payrun_Filters .employee_search_input{
  max-width: 161px;
}


.payrun_table_container{
  width: 100%;
  padding: 0px 24px;
  flex: 1 1 0;
  margin-top: 18px;
}

.payrun_table{
  padding: 10px 24px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  background: var(--White-BG, #FFF);
  height: 100%;
  position: relative;
}

.payrun_table_total{
  width: 100%;
    position: absolute;
    bottom: 0px;
    left: 0px;
    border-top: 1px solid var(--Stroke--Grey, #E4E4E7);
    background: var(--White-BG, #FFF);
    padding: 32px 24px;
}

.payrun_table .table-container{
  padding: 0px;
}

.payrun_table .table-container .table-main-1 td{
  padding: 10px;
}

.payrun_table_total h3{
  text-align: right;
  overflow: hidden;
  color: #1C1C1C;
  text-overflow: ellipsis;

  /* Nav item (B) */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: normal;
}



/* =================Run Payroll============== */

.runPayroll_page_container{
  display: flex;
  flex-direction: column;
  height: 100vh;
}

.runPayroll_page_container .dashboardv2_header{
  padding: 12px 24px 10px 24px;
}

.runPayroll_page_container .dashboardv2_filters{
  padding: 0px 24px;
  margin-top: 0px;
}


.runPayroll_Details_container{
  width: 100%;
  flex: 1 1 0;
  margin-top: 24px;
  background-color: white;
  display: flex;
  gap: 10px;
  padding: 24px;
}

.payrollHistory{
  width: calc(55% - 5px);
  height: 100%;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  padding: 24px;
  display: flex;
  flex-direction: column;
}

.draftedPayments{
  width: calc(45% - 5px);
  height: 100%;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  padding: 24px;
  display: flex;
  flex-direction: column;
}

.runPayroll_Details_container .payroll_container_header{
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Section/Heading */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 228.571% */
  letter-spacing: -0.084px;
  margin-bottom: 0px;
}

.payrollHistory_table_container{
  width: 100%;
  flex: 1 1 0;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
  margin-top: 14px;
}
.payrollHistory_table_container::-webkit-scrollbar{
  display: none;
}

.payrollHistory_table{
  width: 100%;

}

.draftedPayments_card_container{
  width: 100%;
  flex: 1 1 0;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 24px;
}

.draftedPayments_card_container::-webkit-scrollbar{
  display: none;
}

.payrollHistory_table .table-main-1 td{
  padding: 10px;
}


.draftedPayments_card{
  padding: 16px;
  border-radius: 10px;
  border: 1px solid #E4E4E7;
  background: var(--White-BG, #FFF);
}

.draftedPayments_card_header{
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.draftedPayments_card_header h3{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Section/Heading */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 15px;
  letter-spacing: -0.084px;
  margin-bottom: 0px;
}

.draftedPayments_card_details{
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-top: 16px;
}

.draftedPayments_period h4{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Chart content(b) */
  font-family: 'Geist-Medium';
  font-size: 12px;
  font-style: normal;
  font-weight: 126;
  line-height: 13px; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 8px;
}

.draftedPayments_period p{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Chart content(r) */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 13px; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
}

.draftedPayments_status{
  padding: 10px;
  width: 112px;
  min-width: fit-content;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--Colors-Light-color-6, #E1F0E9);

  color: var(--Green, #18AF66);
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  display: flex;
  justify-content: center;
  align-items: center;
}


.pending {
  color: #E83453;
  background-color: #FFE6EB;
}

.approved {
  color: #18AF66;
  background-color: #E1F0E9;
}

.waiting{
  color: #E4B014;
  background-color: #FFF8E3;
}





/* =================Create a Schedule===================== */

.createSchedule_page_container{
  display: flex;
  flex-direction: column;
  height: 100vh
}

.createSchedule_page_container .dashboardv2_header{
  padding: 12px 24px 10px 24px;
}

.runPayroll_table_container{
  flex: 1 1 0;
  margin-top: 10px;
  background-color: white;
  position: relative;
}

.runPayroll_table_filters_container{
  padding: 12px 24px 12px 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.runPayroll_table_search_filters{
  display: flex;
  align-items: center;
  gap: 20px;
}

.selected_employee_count p{
  color: var(--Accent, #8617AA);
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
}


.createSchedule_table .table-main-1 td{
  padding: 10px;
}

.preview_button{
  position: sticky;
  bottom: 0px;
  left: 0px;
  width: 100%;
  border-top: 1px solid var(--Stroke--Grey, #E4E4E7);
  /* background: var(--White-BG, #aa4747); */
  background: var(--White-BG, #fff);
  padding: 24px 24px;
  display: flex;
  align-items: center;
}

.preview_button h3{
  overflow: hidden;
  color: #1C1C1C;
  text-overflow: ellipsis;

  /* Nav item (B) */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: normal;
  margin-bottom: 0;
  margin-left: auto;
}

.btn_outline{
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Button-Accent, #1C1C1C) !important;
  padding: 8px 16px;
  color: var(--Button-Accent, #1C1C1C) !important;

  /* Button/primary */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  background-color: transparent !important;
  margin-left: auto;
}



/* ================Exception Reporting v2 page=================== */

.exceptionReportingv2_page_container{
  display: flex;
  flex-direction: column;
  height: 100vh;
  /* overflow: hidden; */
}

.exceptionReportingv2_page_container .dashboardv2_header{
  padding: 12px 24px 10px 24px;
}

.exceptionReporting_filters_container .dashboardv2_filters{
  padding: 0px 24px;
  margin-top: 0px;
}

.exceptionReporting_filters_container .dashboardv2_filters_buttons{
  margin-top: 0px;
}



.exceptionReporting_table_notification_container{
  flex: 1 1 0;
  padding: 24px 24px 12px 24px;
  display: flex;
  gap: 10px;
  
}



.exceptionReporting_table_container{
  width: calc(70% - 5px);
  height: 100%;
  display: flex;
  flex-direction: column;
}

.exceptionReporting_table_tabs .forecastingv2_tabs_container{
  position: relative;
}




.exceptionReporting_table_tabs .forecastingv2_tabs_container{
  background-color: #F4F4F5;
  padding: 5px;
  width: fit-content;
}


.exceptionReporting_table_tabs .forecastingv2_tabs_container{
  margin-top: 0px;
}



.exceptionReporting_table_tabs .forecastingv2_tabs.active{
  background-color: white;
  color: #1C1C1C;
  font-family: 'Geist-Medium';
}

.exceptionReporting_table_tabs .forecastingv2_tabs{
  margin-top: 0px;
  padding: 8px 12px;
}

.exceptionReporting_table{
  width: 100%;
  padding: 10px;
  flex: 1 1 0;
  background-color: white;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.exceptionReporting_table::-webkit-scrollbar{
  display: none;
}

.exceptionReporting_table tr{
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.exceptionReporting_table .table-main-1 td{
  padding: 10px;
}

.triggerOn h3{
  color: var(--Black, #1C1C1C);

  /* Table/Content(B) */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-bottom: 10px;
}

.triggerOn span{
  color: var(--subtext-grey-b-text, #94A3B8);
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
}


.triggerType{
  width: fit-content;
  padding: 4px 10px;
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  border-radius: 50px;
background: var(--Stroke--Grey, #E4E4E7);
}


.sentOn{
  display: flex;
  align-items: center;
  gap: 16px;

}


.lastUpdate p{
  color: var(--subtext-grey-b-text, #94A3B8);
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
}


.table_actions{
  display: flex;
  align-items: center;
  gap: 16px;
}



.exceptionReporting_notification{
  width: calc(30% - 5px);
  height: 100%;
  border-radius: 10px;
  background: var(--White-BG, #FFF);
  padding: 24px 24px 8px 24px;
  display: flex;
  flex-direction: column;
}

.exceptionReporting_notification_header{
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.exceptionReporting_notification_header h3{
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Section/Heading */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 228.571% */
  letter-spacing: -0.084px;
}

.notifications_card_container{
  width: 100%;
  flex: 1 1 0;
  /* display: flex; */
  /* flex-direction: column; */
  overflow-y: scroll;
  -ms-overflow-style: none; 
  scrollbar-width: none; 
}

.notifications_card_container::-webkit-scrollbar{
  display: none;
}

.notifications_card{
  width: 100%;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
  padding: 10px;
  display: flex;
  align-items: center;
  gap: 24px;
  margin-top: 12px;
}

.notificationDetails h4{
  color: #000;
  leading-trim: both;
  text-edge: cap;

  /* Chart content(r) */
  font-family: 'Geist-Medium';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 13px; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
}

.notificationDetails p{
  color: var(--subtext-grey-b-text, #94A3B8);
  leading-trim: both;
  text-edge: cap;

  /* Chart Small */
  font-family: 'Geist-Regular';
  font-size: 10px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 15px */
  letter-spacing: -0.06px;
  margin-bottom: 0px;
  margin-top: 8px;
}


/* ======================Add Exception=================== */

.addException_form .single_input{
  width: 100%;
}

.sendAlertOnContainer{
  display: flex;
  align-items: center;
  gap: 16px;
}

.sendAlertDiv{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  
  cursor: pointer;
}

.sendAlertDiv p{
  color: var(--Black, #1C1C1C);

  /* Table/Content(B) */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-bottom: 0px;
}

.selected {
  background: var(--Selected-BG, #F4F4F5);
}

.triggerCondition{
  margin-top: 16px;
}

.triggerCondition_details{
  width: 100%;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--Selected-BG, #F4F4F5);
  margin-top: 6px;
  padding: 10px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.triggerCondition_details .dm_mono_font{
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;
  font-family: "DM Mono",monospace !important;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  margin-bottom: 0px;
  /* width: fit-content; */
}

.setMinMaxTrigger{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 4px 10px;
  background-color: white;
}


.setMinMaxTrigger p{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
}


.slider_options{
  display: flex;
  align-items: center;
  gap: 32px;
}



/* ===================Activity Logs==================== */

.activityLogs{
  display: flex;
  flex-direction: column;
}

.activityLogs .slidingWindow_Body{
  flex: 1 1 0;
}

.activityLog_header_details{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}

.activityLog_header_details p{
  color: var(--subtext-grey-r-text, #71717A);

  /* Table/Content(B) */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-bottom: 0px;
}


.activityLog_header_details span{
  padding: 4px 10px;
  border-radius: 50px;
  background: var(--Stroke--Grey, #E4E4E7);
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
}

.activities_container{
  width: 100%;
  height: 100%;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
  margin-top: 6px;
}

.activities_container::-webkit-scrollbar{
  display: none;
}

.activity_cards{
  padding: 16px 24px;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.activityDate p{
  color: var(--subtext-grey-b-text, #94A3B8);
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
}

.activity_details{
  display: flex;
  gap: 6px;
  align-items: flex-start;
  margin-top: 14px;
}

.activity_details h4{
  color: #000;
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
}

.activity_more_details{
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.activity_more_details p{
  padding: 10px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--Selected-BG, #F4F4F5);
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;
  font-family: "DM Mono", monospace !important;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  /* text-decoration-line: strikethrough; */
}


/* ===================Journal Entry ====================== */

.journalEntry_page{
  display: flex;
  flex-direction: column;
  height: 100vh;
  position: relative;
}

.journalEntry_page .dashboardv2_header{
  padding: 12px 24px 10px 24px;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
}

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

/* .dashboardv2_header button{
  
  width: 105px;
  min-width: fit-content;
} */

.journalEntry_total{
  position: absolute;
  width: 100%;
  bottom: 0px;
  left: 0px;
  padding: 10px 24px;
  border-top: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  box-shadow: 0px -7px 24.7px 0px rgba(186, 186, 186, 0.06);
  display: flex;
  flex-direction: column;
}

.total_debits_credits_container{
  display: flex;
  gap: 20px;
  align-items: center;
  margin-left: auto;

}

.total_debits_credits p{
  color: #000;
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 8px;
}

.total_debits_credits_container .icon {
  height: 14px;
  width: 14px;
}

.total_debits_credits h3{
  color: #000;

  /* Table/Content(B) */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-top: 0px;
}

.total_difference{
  margin-left: auto;
  margin-top: 8px;
}


.total_difference p{
  color: #000;
  text-align: right;
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  margin-bottom: 0px;
}

.total_difference p span{
  color: #18AF66;
}

.total_difference.error_text p span{
  color: #ff4b6e;
}

.journalEntry_filters_container{
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 16px 24px;
  border-bottom: 1px solid #E4E4E7;
}

.journalEntry_filters_div1{
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
}

.journalEntry_inputs{
  width: 210px;
}

.journalEntry_inputs input, .journalEntry_inputs select{
  width: 100%;
}

.journalEntry_description{
  flex: 1 1 0;
  width: auto;
}

.journalEntry_table_container{
  flex: 1 1 0;
  width: 100%;
  padding: 16px 0px 98px 10px;
  overflow: scroll;
  /* -ms-overflow-style: none;
  scrollbar-width: none; */
}

.journalEntry_table_container::-webkit-scrollbar{
  /* display: none; */
}

.journalEntry_table_container .table-main-1 th{
  font-size: 12px;
  padding: 9.5px 8px 9.5px 16px;
}

.journalEntry_table_container .table-main-1 th, .table-main-1 td{
  overflow: visible;
}

.journalEntry_table_container .chosen-container-single .chosen-single{
  border: none;
}

.journalEntry_table_container input{
  border: none;
}

.journalEntry_table_container .account_col {
  width: 175px;
}

.journalEntry_table_container .main_col_width {
  width: 173px;
  min-width: 160px;
}

.journalEntry_table_container .quantity_col {
  width: 89px;
  min-width: 89px;
}

.journalEntry_table_container .amounts_col {
  width: 100%;
  min-width: 100px;
}

.journalEntry_table_container .table-container{
  height: fit-content !important;
}

.journalEntry_table_container .table-wrapper{
  overflow-y: visible;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.journalEntry_table_container .table-wrapper::-webkit-scrollbar{
  display: none;
}

.addLine_container{
  display: flex;
  width: 100%;
  justify-content: end;
  gap: 4px;
  padding-right: 6px;
}

.addLine_container button {
  padding: 4px;
}

.addLine_container span {
  padding: 4px 0px;
}

.addLine_container * {
  color: var(--Accent, #8617AA);

  /* Button/Secondary */
  font-family: 'Geist-Medium';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  border-radius: var(--Border-Radius, 4px);
  border: none;
  background-color: transparent;
}

/* .addLine_container button {
  margin-left: auto;
  color: var(--Accent, #8617AA);

  Button/Secondary
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px;  166.667%
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
} */

.transac_Id input{
  background: var(--Selected-BG, #F4F4F5);
}





/* =======================Products Page======================= */

.products_page_container{
  height: 100vh;
  position: relative;
  overflow: hidden;
}

.product_slider .dayx_form_input_container{
  gap: 24px;
  margin-bottom: 0px;
}

.product_slider .slidingWindow_Body{
  padding: 0px;
}

.product_form{
  padding: 15px 24px;
  border-bottom: 1px solid #E4E4E7;
}

.product_info_container{
  padding: 15px 24px;
  display: flex;
  gap: 24px;
}

.product_info{
  width: calc(50% - 12px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.product_info_header{
  display: flex;
  gap: 24px;
  align-items: center;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
  padding: 10px 0px;
}

.product_info_header h3{
  color: var(--Black, #1C1C1C);

  /* Label */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 142.857% */
  margin-bottom: 0px;
}

.product_info_input_container input{
  width: 100%;
}

.productDescription{
  padding: 0px 24px 15px 24px;
}

.productDescription input{
  width: 100%;
}

.products_page_container .table_actions{
  justify-content: space-evenly;
}


.slidingWindow_header_actions{
  display: flex;
  gap: 32px;
  align-items: center;
}


/* ================Customers New Design======================= */

.customersv2_page_container{
  display: flex;
  flex-direction: column;
  height: 100vh;
  overflow: hidden;
  position: relative;
}

.customersv2_page_container .dashboardv2_header{
  padding: 12px 24px 10px 24px;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.dashboardv2_header button{
  min-width: 120px;
  width: auto;
}

.dashboardv2_header .btn_outline{
  min-width: fit-content;
}

.dashboardv2_header_btn_container{
  display: flex;
  align-items: center;
  gap: 10px;
}

.customersv2_page_container .employee_filter_container{
  margin-top: 8px;
}


.customerv2_table_container{
  margin-top: 16px;
  flex: 1 1 0;
  background-color: white;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
  padding: 0px 12px;
}

.customerv2_table_container::-webkit-scrollbar{
  display: none;
}

.table-main-1.table-normal td{
  padding: 10px;
}

.table-normal tr{
  background-color: white;
}

.table-normal tr:hover{
  background-color: var(--Hover-BG, #F9F9FA) !important;
} 

.table-main-1.table-normal tbody td{
  background-color: transparent ;
}

.table-main-1 .sub_text {
  overflow: hidden;
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Chart content(r) */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
}

.sub_Business_Unit{
  overflow: hidden;
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Chart content(r) */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
}

.dropDown_container{
  display: flex;
  align-items: flex-start;
  gap: 16px;
  /* justify-content: space-between; */

  cursor: pointer;
}

.dropDown_container svg{
  margin-top: 6px;
}

.selected_List{
  display: flex;
  flex-direction: column;

}

.selected_List p{
  margin-bottom: 1px;
}

.costCentre_dropDown_container{
  position: relative;
}

.dropDown_options{
  position: absolute;
  top: 103%;
  left: 0px;
  padding: 8px 16px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  /* Shadow */
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index: 999;
  max-height: 130px;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.dropDown_options > .dropDown_option {
  width: 100%;
}

.dropDown_options::-webkit-scrollbar{
  display: none;
}

.dropDown_options span{
  overflow: hidden;
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Chart content(r) */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
}


/* =================Create Customer================== */

.customersv2_page_container .slidingWindow_Body{
  padding: 0px 0px 95px 0px;
}

.customer_form{
  padding: 24px 24px 16px 24px;
}

.customer_form_2{
  padding: 24px;
  border-top: 1px solid #E4E4E7;
  border-bottom: 1px solid #E4E4E7;
}

.customer_form3{
  padding: 8px 24px 24px 24px;
}

.deleteCostCentre{
  display: flex;
  justify-content: flex-end;
}

.purple_para{
  color: var(--Accent, #8617AA);

  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
}

.selectedCOA{
  margin-top: 24px;

}

.selectedCOA p{
  overflow: hidden;
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
}

.selectedCOA_container{
  margin-top: 16px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.selectedCOA_div{
  padding: 8px 16px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  cursor: pointer;
}


.customerDetails_form .customer_form{
  padding: 0px 24px 16px 24px;
}

.cust_Edit{
  width: 100%;
  display: flex;
  justify-content: flex-end;
  padding: 24px 24px 10px 24px;
}

.cust_Edit p{
  cursor: pointer;
}

.black-label {
  color: black;
}

.gray-label {
  color: #71717A;
}



/* ===============Multi Select=============== */


.multi_select_container{
  position: relative;

}

.multi_selected_values{
  width: 100%;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: #FFF;
  padding: 8px 12px;
  font-size: 14px;
  outline: none;
  line-height: 20px;
  font-family: 'Geist-Regular';
  height: fit-content;
  display: flex;
  align-items: center;
  overflow-x: scroll;
  gap: 4px;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.multi_selected_values::-webkit-scrollbar{
  display: none;
}

.multi_selected_values p{
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  margin-bottom: 0px;
  min-width: fit-content;
  width: auto;
}

.mult_select_dropdown_options{
  width: 100%;
  padding: 16px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  position: absolute;
  top: 100%;
  left: 0px;
  z-index: 999;
  background-color: white;
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: 150px;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.mult_select_dropdown_options label{
  display: flex;
  align-items: center;
  gap: 10px;
}

.mult_select_dropdown_options p{
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  margin-bottom: 0px;
}

.multi_selected_values_card{
  /* display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  border-radius: 4px;
  gap: 10px; */
  min-width: fit-content;
  width: auto;
}

.cutomerInvoice_table_container{
  padding: 12px;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}


.cutomerInvoice_table_container::-webkit-scrollbar{
  display: none;
}


.customerInvoice_Slider .slidingWindow_Body{
  padding: 16px 24px 92px 24px;
}

.invoice_Descrip{
  margin-top: 16px;
}

.invoice_Descrip input{
  width: 100%;
}

.cutomerInvoice_table_container .chosen-container-single .chosen-single{
  border: none;
  background-color: transparent;
}

.cutomerInvoice_total_container{
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  width: 100%;
}

.cutomerInvoice_total_container{
  border-top: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  padding: 16px 0px;
}

.cutomerInvoice_total_container h2{
  overflow: hidden;
  color: #1C1C1C;
  text-overflow: ellipsis;
  width: fit-content;
  /* Nav item (B) */
  font-family: 'Geist-SemiBold';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: normal;
}

.addDiscount{
  margin-top: 8px;
  margin-bottom: 16px;
}

.currencyCnverion_container{
  display: flex;
  gap: 24px;
  align-items: center;

}
.currencyCnverion_container .chosen-container{
  width: fit-content !important;
}
.currencyConv_Note{
  margin-top: 32px;
}

.currencyConv_Note p{
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
}

.discount_container{
  margin-top: 16px;
  width: 100%;
  margin-bottom: 32px;
}

.discount_container_inputs{
  display: flex;
  justify-content: flex-end;
  background: var(--Hover-BG, #F9F9FA);
  padding: 8px;
  align-items: center;
  gap: 6px;
}

.discount_container_inputs input{
  border: none;
  width: 100px;
}

.purple_para{
  cursor: pointer;
}

.customerInvoice_Slider .cust_Edit{
  padding-top: 0px;
}


/*  ====================== Custom multi select element ========================= */

.one_line_multiselect_container {
  height: 37.6px;
  max-width: 150px;
}


.one_line_multiselect_container .chosen-choices {
  display: flex;
  overflow-x: auto;
  scrollbar-width: none;
}

.one_line_multiselect_container .chosen-container-multi .chosen-choices li.search-choice {
  background-color: white;
  white-space: nowrap;
  max-width: max-content;
  margin: 0px 1px;
  border: none;
}




.filter_multi_select_container {
  height: 37.6px;
  max-width: 160px;
  position: relative;
}

.filter_multi_select_container .filter_name_container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 4px;
  height: 35px;
  background-color: white;
  padding: 8px 12px;
  width: calc(100% - 2px);
  pointer-events: none;
  z-index: 999;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.filter_multi_select_container .filter_name_container .filters_count {
  display: flex;
  height: 16px;
  width: 16px;
  border-radius: 50%;
  align-items: center;
  justify-content: center;

  background-color: var(--black);
  color: white;
  font-size: 12px;
  font-weight: bold;
}

.filter_multi_select_container * {
  cursor: pointer;
}

.filter_multi_select_container .chosen-choices {
  display: flex;
  overflow-x: auto;
  scrollbar-width: none;
  cursor: pointer;
}

.filter_multi_select_container .chosen-container-multi .chosen-choices li.search-choice {
  display: none;
  background-color: white;
  white-space: nowrap;
  max-width: max-content;
  margin: 0px 1px;
  border: none;
}


.multi_select_component {
  position: relative;
}

.multi_select_component .multi_selected_values {
  width: 100%;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: #FFF;
  padding: 8px 12px;
  font-size: 14px;
  outline: none;
  line-height: 20px;
  font-family: 'Geist-Regular';
  height: fit-content;
  display: flex;
  align-items: center;
  overflow-x: scroll;
  gap: 4px;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.multi_select_component .mult_select_dropdown_options {
  width: fit-content;
  padding: 16px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  position: absolute;
  top: 100%;
  left: 0px;
  z-index: 999;
  background-color: white;
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: 200px;
  -ms-overflow-style: none;
  scrollbar-width: none;
}


/* Chat bot styles */

.message {
  margin-bottom: 10px;
}

.typing {
  overflow: hidden; /* Ensures dots are hidden during animation */
  white-space: nowrap; /* Ensures dots are on the same line */
  animation: typing 1s steps(5, end) infinite;
}

@keyframes typing {
  from {
    width: 0;
  }
  to {
    width: 5em; /* Adjust the width based on the length of your message */
  }
}

/* .slow-text-animation {
  animation: fadeInText 2s linear;
} */

.slow-text-animation {
  display: inline-block;
  overflow: hidden;
}

@keyframes fadeInText {
  from {
      opacity: 0;
  }
  to {
      opacity: 1;
  }
}

.cutomerInvoice_slider_table_container .chosen-container-single .chosen-single{
  border: none;
  background-color: transparent;
}






/* =================Payments===================== */

.customer_payments_page{
  display: flex;
  flex-direction: column;
  height: 100vh;
}

.payments_table_container{
  flex: 1 1 0;
  margin-top: 16px;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.payments_table_container::-webkit-scrollbar{
  display: none;
}

.payments_tab_container{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 16px;
}

.tab_container_divider{
  position: absolute;
  top: 50%;
  left: 0px;
  width: 100%;
  height: 1px;
  background: #E4E4E6;
  z-index: 0;
}

.payments_tab_container .forecastingv2_tabs_container{
  position: relative;
  background-color: white;
}

.payments_tab_container .forecastingv2_tabs.active{
  background: var(--Selected-BG, #F4F4F5);
  color: var(--Black, #1C1C1C);;
}

.addNewPaymentAccount{

}

.addNewPaymentAccount_header{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0px 24px;

}

.addNewPaymentAccount_header h3{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Section/Heading */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 228.571% */
  letter-spacing: -0.084px;
}

.addNewPaymentAccount_container{
  padding: 24px 0px;
  background: var(--Hover-BG, #F9F9FA);
}

.createPayment_Modal .panel-body{
  padding: 16px 0px;
}

.createPayment_Modal .dayx_form_input_container{
  padding: 0px 24px;
}

.view_payment_modal .panel-body{
  padding: 16px 14px;
}

.payment_modal_tab_container{
  /* height: 300px; */
  padding: 41px 20px 16px 20px;
}

.payment_modal_tab_container .forecastingv2_tabs{
  margin: 0px;
}

.addPaymentLink{
  display: flex;
  justify-content: flex-end;
}


/* =================Coa Mapping================== */
.coa_Page_container{
  /* background-color: white; */
  height: 100vh;
  overflow-y: hidden;
  display: flex;
  flex-direction: column;
}

.coa_actions{
  display: flex;
  gap: 12px;
  align-items: center;
}

.coa_table_container{
  margin-top: 16px;
  flex: 1 1 0;
  -ms-overflow-style: none;
  scrollbar-width: none;
  overflow-y: auto;
}

.coa_table_container::-webkit-scrollbar{
  display: none;
}

.importedLevel2{
  display: flex;
  align-items: center;
  gap: 4px;
}

.importedLevel2 p{
  width: 100px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.maps_to_col_table {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.coa_table_container .chosen-container-single .chosen-single{
  border: none;
  background: transparent;

}

.toggle-animation {
  opacity: 0;
  animation: fadeInOut 2s ease-in-out infinite;
}

@keyframes fadeInOut {
  0%, 100% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
}

.cursor {
  display: inline-block;
  width: 1ch;
  animation: flicker 0.5s infinite;
  margin-bottom: 4px;
}

@keyframes flicker {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.dayx_botName{
  position: relative;
}

.dayx_botName span{
  font-size: 7px;
  position: absolute;
  top: 100%;
  left: 0px;
  width: 100px;
  display: block;
  color: #71717A;
}






/* ================Drag and drop================== */

.draggable-container {
  display: flex;
}
.draggable {
  cursor: pointer;
  border: 1px solid #ccc;
  padding: 10px;
  margin: 5px;
  flex: 1;
}


.submitBtn_container button:disabled{
  background: var(--Placeholder-Text, rgba(113, 113, 122, 0.50));
  border: none;
  color: white;
}

.table_moreActions{
  position: relative;
}

.delete_action{
  position: absolute;
  top: 100%;
  right: 100%;
  padding: 10px 12px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  border-radius: 4px;
  /* Shadow */
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
}

.delete_action p{
  overflow: hidden;
  color: var(--Red, #E83453);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Chart Small */
  font-family: 'Geist-Regular';
  font-size: 10px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 15px */
  letter-spacing: -0.06px;
  

}

/* .multiSelect_Original .chosen-container .chosen-container-multi{
  overflow-x: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.multiSelect_Original ul.chosen-choices{
  display: flex;
  align-items: center;
  gap: 6px;
  
}

.multiSelect_Original ul.chosen-choices li{
  min-width: fit-content;
}

.multiSelect_Original ul.chosen-choices li span{
  min-width: fit-content;
}

.multiSelect_Original ul.chosen-choices::-webkit-scrollbar{
  display: none;
} */

/* ===============Sign Up page ==================*/



.sign_up_page .signup_form{
  width: 622px;
}

.sign_up_page .signin_input_container{
  align-items: flex-start;
  gap: 10px;
}

.sign_up_page .signin_input_container .dayx_form_input_container{
  width: 100%;
}

.sign_up_page  .dayx_form_input_container{
  gap: 16px;
}





/* ===================Onboarding Page======================= */
.onboarding_form_container{
  display: flex;
  flex-direction: column;
  width: 742px;
  align-items: center;
  gap: 36px;
  padding: 42px 24px 60px 24px;
}

.onboarding_header{
  text-align: center;
}

.onboarding_header p{
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;

  /* Section/Heading */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 228.571% */
  letter-spacing: -0.084px;
  margin-bottom: 0px;
}


.onboarding_header h1{
  color: var(--Black, #1C1C1C);
  font-family: 'Geist-Bold';
  font-size: 32px;
  font-style: normal;
  font-weight: 146;
  line-height: 32px; /* 100% */
  letter-spacing: -0.192px;
  margin-bottom: 0px;
  margin-top: 10px;
}

.onboarding_form{
  width: 410px;
}

.onboarding_form .onboarding_form_inputs {
  margin-bottom: 16px;
}

.onboarding_form_inputs input {
  width: 100%;
}

.onboarding_form_inputs input::placeholder {
  color: rgba(113, 113, 122, 0.5);
}

.onboarding_form_inputs input:-ms-input-placeholder,
.onboarding_form_inputs input::-ms-input-placeholder,
.onboarding_form_inputs input::-moz-placeholder,
.onboarding_form_inputs input:-webkit-input-placeholder {
  color: rgba(113, 113, 122, 0.5);
}

.onboarding_form_inputs textarea {
  padding: 8px 12px;
}

.onboard_company_financialYear label {
  font-weight: 600;
}

.onboard_comp_date{
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.onboard_comp_date span {
  padding: 11.5px 16px;
}

.onboard_comp_date input{
  width: 130px;
}

.onboard_comp_date_divider{
  width: 1px;
  height: 25px;
  background-color: #E4E4E7;
}

.onboard_start_end {
  display: flex;
  align-items: center;
}

.onboarding_form_container button{
  width: 110px;
  border: none;
}

.table_actions_div{
  display: flex;
  align-items: center;
  gap: 16px;
  visibility: hidden;
}

.table_action_btn_container {
  display: flex;
  align-items: center;
  gap: 8px;
  /* visibility: hidden; */
}

.table_action_btn_container svg {
  cursor: pointer;
  margin-right: 5px;
  margin-left: 5px;
}

.table-normal tr:hover .table_actions_div,
.table-normal tr:hover .table_action_btn_container {
 visibility: visible;
}


.welcomeOnboard_modal{
  width: fit-content;
  padding: 24px;
  border-radius: 10px;
  background: var(--White-BG, #FFF);
  width: 350px;

  /* Shadow */
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
}

.welcomeOnboard_modal h2{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Metric Number */
  font-family: 'Geist-Bold';
  font-size: 24px;
  font-style: normal;
  font-weight: 146;
  line-height: 32px; /* 133.333% */
  letter-spacing: -0.144px;
}

.welcomeOnboard_modal p{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
}

.onboarding_list{
  padding-top: 24px;
  margin-top: 24px;
  border-top: 1px solid #E4E4E7;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.onboard_basicDetails{
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.onboard_basicDetails img{
  margin-top: 5px;
}
.onboarding_list h3{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Section/Heading */
  font-family: 'Geist-SemiBold';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 228.571% */
  letter-spacing: -0.084px;
  margin-bottom: 0px;
}

.setUpCOA_onboard_btn{
  display: flex;
  gap: 12px;
}

.setUpCOA_onboard_btn button{
  font-size: 12px;
  border: none;
}

.setUpCOA_onboard_btn .button-outline {
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Button-Accent, #1C1C1C);
}

.onboard_activeData_container{
  width: 100%;
}

.onboard_importData_btn{
  display: flex;
  justify-content: flex-end;
}

.onboard_importData_btn button{
  border: none;
}

.exportGraph_menu{
  position: relative;
}

.exportMenu_options{
  position: absolute;
  top: 100%;
  right: 100%;
  background-color: white;
  box-shadow: 0 0 11px rgba(33,33,33,.2);
  width: 150px;
  min-width: fit-content;
  padding: 16px;
}

.exportMenu_options p{
  min-width: fit-content;
  margin-bottom: 0px;
}


/* ====================Import Bank Statemt================== */
.importBankStatement_Slider .slidingWindow_Body{
  padding: 24px 24px 95px 24px;
}

.dragAndDropFile_container{
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  padding: 24px;
  margin-top: 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.dragAndDropFile_container h3{
  color: var(--Black, #1C1C1C);

  /* Nav item (B) */
  font-family: 'Geist-Bold';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: normal;
  margin: 13px 0px;
}

.dragAndDropFile_container button{
  border: none;
}


.dragAndDropFile_container span{
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;

  /* Chart Small */
  font-family: 'Geist-Regular';
  font-size: 10px;
  font-style: normal;
  font-weight: 84;
  line-height: 11px; /* 15px */
  letter-spacing: -0.06px;
  margin-top: 8px;
  margin-bottom: 0px;
}

.password_confirmation{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
}

.password_confirmation p{
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  margin-bottom: 0px;
}

.importData_password{
  margin-top: 16px;
}


.addNewPayment_Slider .addPayment_form1{
  padding: 24px;
}

.addNewPayment_Slider .addPayment_form2{
  padding: 24px;
  border-top: 1px solid var(--Stroke--Grey, #E4E4E7);
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.addNewPayment_Slider .addPayment_form3{
  padding: 24px;

}

 textarea{
  width: 100%;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: #FFF;
  resize: none;
}

.banking_categories{
  display: flex;
  align-items: center;
  gap: 8px;
}

.banking_categories .category_card{
  padding: 10px;
  border-radius: 4px;
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  color: var(--subtext-grey-r-text, #71717A);

  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  cursor: pointer;
}

.addtoBill_Slider .addPayment_form1{
  border-bottom: 1px solid #E4E4E7;
  padding: 24px;
}



.addtoBill_Slider .addPayment_form2{
  padding: 24px;
}

.billDetails{
  margin-top: 24px;
}

.billDetails .billDetails_header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.billDetails .billDetails_header h3{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Section/Heading */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 228.571% */
  letter-spacing: -0.084px;
}

.billDetails_Content{
  padding: 16px 0px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.billDetails_Content .purple_header{
  overflow: hidden;
  color: var(--Accent, #8617AA);
  text-overflow: ellipsis;

  /* Table/Content(B) */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-bottom: 0px;
}

.billDetails_Content span{
  overflow: hidden;
  color: var(--subtext-grey-r-text, #71717A);
  text-overflow: ellipsis;

  /* Table/Content(B) */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-top: 8px;
}

.billDetails_payment{
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.Addtobill_total{
  margin-top: 8px;
}

.Addtobill_total_header{
  padding: 16px 24px;
  background: var(--Selected-BG, #F4F4F5);
  display: flex;
  justify-content: flex-end;
}

.Addtobill_total_header h3{
  overflow: hidden;
  color: #1C1C1C;
  text-overflow: ellipsis;

  /* Nav item (B) */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: normal;
}

.Addtobill_total_content{
  padding: 24px;
  background-color: #FAFAFA;
  display: flex;
  justify-content: flex-end;
}

.Addtobill_total_content p{
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  text-align: right;
  margin-bottom: 16px;
}

.transaction_comments{
  margin-top: 42px;
}

.dragAndDropFile_container .choose_file_btn{
  padding: 8px 16px;
  color: var(--White-text, #FAFAFA);
  border-radius: var(--Border-Radius, 4px);
  background: var(--Button-Accent, #1C1C1C);
  cursor: pointer;

  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
}



/* ====================Add To Bill Search====================== */

.add_toBill_search{
  position: relative;
}

.searched_options{
  /* display: none; */
  position: absolute;
  top: 100%;
  left: 0px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);

  /* Shadow */
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
  width: 250px;
  max-height: 500%;
  overflow-y: auto;
  scrollbar-width: none;
}

.searched_options_div{
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
}

.searched_options_div input{
  width: fit-content;
}

.searched_options_div p,
.searched_options_div label {
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  margin-bottom: 0px;
}

/* .searched_options.show {
  display: block;
} */

.selected_Bills{
  margin-top: 24px;
}

.selected_Bills h3{
  color: var(--Black, #1C1C1C);

  /* Label */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 142.857% */
}

.selected_Bills_container{
  margin-top: 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}


.selected_bills_card{
  padding: 8px 12px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);

  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  display: flex;
  align-items: center;
  gap: 12px;
}
.selected_bills_card p{
  margin-bottom: 0px;
}

/* ====================Settings v2============================= */

.settingsv2_page{
  overflow: hidden;
  height: 100vh;
  display: flex;
  flex-direction: column;
  background-color: white;
  position: relative;
}

.settingsv2_page .dashboardv2_header{
  border-bottom: 1px solid #E4E4E7;
}

.settings_tab_container{
  margin-top: 16px;
  height: 100%;
  display: flex;
}

.settings_tabs{
  padding: 0px 10px 0px 24px;
  height: 100%;
  border-right: 1px solid #E4E4E7;
  width: fit-content;
}

.settings_tabs .settings_tab_card{
  padding: 10px 12px;
  border-radius: 4px;
  cursor: pointer;
  margin-bottom: 8px;
  width: 226px;
}

.settings_tabs .settings_tab_card h3{
  color: var(--Black, #1C1C1C);

  /* Table/Content(B) */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-bottom: 0px;
}

.settings_tabs .settings_tab_card.active{
  border-right: 5px solid var(--Accent, #8617AA);
  background: var(--Selected-BG, #F4F4F5);
}

.settings_tab_body{
  flex: 1 1 0;
  display: flex;
  overflow-x: hidden;
  flex-direction: column;
}


.settings_tabBody_header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
  
}

.settings_tabBody_header h2{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* empty screen heading */
  font-family: 'Geist-Medium';
  font-size: 20px;
  font-style: normal;
  font-weight: 106;
  line-height: 21px; /* 160% */
  letter-spacing: -0.12px;
}


.settings_tabBody_header button{
  border: none;
}

.setting_tabs_bodyDetails{
  width: 100%;
  overflow-y: scroll;
  height: fit-content;
  /* height: 100%; */
  -ms-overflow-style: none;
  scrollbar-width: none;
  padding-bottom: 80px;
}

.setting_tabs_bodyDetails::-webkit-scrollbar{
  display: none;
}

.tab_w-550{
  width: 550px;
}

.company_Profile_Details{
  height: fit-content;
  margin: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.tab_w-550 input{
  width: 100%;
}

 .businessDetails{
  color: var(--subtext-grey-b-text, #94A3B8);
  leading-trim: both;
  text-edge: cap;

  /* Table/Header */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 126;
  line-height: normal;
}

.companyDetails_inputContainer{
  margin-bottom: 8px;
}

.companyDetails_inputContainer span{
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
}

.companyDetails_inputContainer span.purple_para{
  color: #8617AA;
  cursor: pointer;
}

.financialConfig{
  margin-top: 16px;
}

.hq_details{
  margin-top: 24px;
}

.h1_details_header{
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.hq_details h3{
  color: var(--Increase, #000);
  leading-trim: both;
  text-edge: cap;

  /* Table/Header */
  font-family: 'Geist-Medium';
  font-size: 12px;
  font-style: normal;
  font-weight: 126;
  line-height: normal;
}


.hq_Details_table .table-container{
  padding: 0px;
  margin-top: 12px;
}


.hq_tbody p{
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
}

.message {
  color: #444;
  padding: 10px 10px;
  line-height: 26px;
  font-size: 12px;
  border-radius: 7px;
  display: inline-block;
  position: relative
}

.my-message {
  background: #efefef
}

.hq_tbody span{
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;

  /* Section/Sub-Text */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 84;
  line-height: 150%; /* 18px */
  letter-spacing: -0.072px;
  padding: 5px 10px;
  border-radius: 50px;
  background: var(--Stroke--Grey, #E4E4E7);
}

.hq_tbody_spanContainer{
  margin-top: 10px;
}

.hq_Details_table .table_actions_div{
  visibility: visible;
}

.otherConfigLinks{
  margin-top: 24px;
}

.otherConfigLinks_cardContainer{
  display: flex;
  align-items: center;
  gap: 16px;
}

.otherConfigLinks_card{
  padding: 8px 16px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  display: flex;
  width: 226px;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}

a.otherConfigLinks_card:hover {
  text-decoration: none;
}

.otherConfigLinks_card h3{
  color: var(--Black, #1C1C1C);

  /* Table/Content(B) */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-bottom: 0px;
}


.AddSubsidiary_Slider .slidingWindow_Body{
  padding: 0px 0px 90px 0px;
}


.settings_data_management h3{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Section/Heading */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 126;
  line-height: 32px; /* 228.571% */
  letter-spacing: -0.084px;
}

.upload_btn{
  display: flex;
  align-items: center;
  gap: 10px;
  border-radius: 6px;
  background: var(--Button-Accent, #1C1C1C);
  padding: 8px 16px;
}

.upload_btn p{
  color: var(--White-text, #FAFAFA);

  /* Button/primary */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-bottom: 0px;
}

.upload_dropDown_menu{
  left: auto;
  right: 40%;
}

.upload_dropDown_menu a{
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  padding: 10px 16px;
}


.reporting_settingsTabContainer .forecastingv2_tabs_container{
  border-radius: var(--Border-Radius, 4px);
  background: #F4F4F5;
}

.reporting_settingsTabContainer .forecastingv2_tabs.active{
  background-color: white;
  font-family: 'Geist-Medium';
  color: #1C1C1C;
}

.tab_w-680{
  width: 680px;
}

.addCostCenter_btn{
  margin: 24px 0px;
  display: flex;
  justify-content: flex-end;
}


.costCenter_accordian_container{
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.costCenter_accordian_header{
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 10px;
  border-radius: var(--Border-Radius, 4px);
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
  /* background: var(--Selected-BG, #F4F4F5); */
  cursor: pointer;
}

.costCenter_accordian_card h3{
  color: var(--Black, #1C1C1C);

  /* Table/Content(B) */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-bottom: 0px;
}

.costCenter_accordian_body{
  padding: 12px 0px;
  display: flex;
  align-items: flex-start;
  gap: 24px;
}

.costCenter1_div{
  width: calc(50% - 12px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.costCenter2_div_container{
  width: calc(50% - 12px);
}

.costCenter2_div{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.Add_Save_btn{
  margin-top: 10px;
  display: flex;
  justify-content: flex-end;
}
.active-header {
  background-color: #F4F4F5; /* Change this color to your desired color */
}


.addCostCenter_div{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.addCostCenter_div input{
  border: none;
  padding: 0px;
}

.costCenter_accordian_card_addNew{
  display: flex;
  padding: 10px;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.costCenter_accordian_card_addNew input{
  padding: 0px;
  border: none;
  width: 70%;
  border-radius: var(--Border-Radius, 4px);

}

.saveNewCostCenter{
  display: flex;
  justify-content: flex-end;
}

.glEntry_card_Container{
  display: flex;
  flex-direction: column;
  gap: 10px;
}


.glEntry_card{
  border-radius: var(--Border-Radius, 4px);
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
 
  padding: 20px 16px;
}

.glEntry_card:hover{
  background: var(--Hover-BG, #F9F9FA);
}

.glEntry_card h3{
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  margin-bottom: 0px;
}

.flex-end_content{
  display: flex;
  justify-content: flex-end;
}

.default_payroll_value{
  color: #94A3B8;
}

.form_input .toggle_value{
  max-width: fit-content;
}

.default_value_div{
  display: flex;
  gap: 6px;
  align-items: center
}

.default_value_div input{
  flex: 1 1 0;
}

.isItDeduction {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 16px 0px 24px;
}

.isItDeduction input {
  margin: 0px;
}

.isItDeduction p,
.isItDeduction label {
  overflow: hidden;
  color: var(--subtext-grey-r-text, #71717A);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  margin-bottom: 0px;
}

.userManagement_table_container{
  margin-top: 12px;
}

.table_actions_div svg{
  cursor: pointer;
}

.userManagement_table_container .chosen-container-single .chosen-single{
  border: none;
  background-color: transparent;
}

.accessManagement_tab_container{
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.dayx_form_input_container .access_details{
  color: var(--subtext-grey-b-text, #94A3B8);

  /* Button/Secondary */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: 20px; /* 166.667% */
  margin-top: 6px;
}


.addRole_description{
  width: 100%;
  margin-top: 26px;
}

.addRole_description textarea{
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: #FFF;
}

.company_Profile_Details{

}

.accessManagement_container{
  display: flex;
  flex-direction: column;
  height: 100%;
}

.userManagement_table_container{
  flex: 1 1 0;
}

.accessManagement_container .multi_selected_values{
  border: none;
  background-color: transparent;
  position: relative;
  padding-right: 24px;
  max-width: 250px;
}

.accessManagement_container .multi_select_container{
  max-width: 250px;
}

.addRole_modal .multi_selected_values{
  padding-right: 24px;
}

.multiSelect_dropDown_icon{
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
}

.dashboardv2_filter_dropdown .toggle_dropdown_btn{
  display: flex;
  align-items: center;
}


.dashboardv2_filter_dropdown .toggle_dropdown_btn p{
  margin-bottom: 0px;
  width: fit-content;
}


.resp_header{
  display: none;
}


/* ============================Non Current Assets================================== */

.ncav2_page_container{
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: 100vh;
  position: relative;
}

.ncav2_page_container .dashboardv2_header{
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
}

.nca_row_details_container{
  display: flex;
  gap: 16px;
  
  padding: 16px;
  background: var(--Hover-BG, #F9F9FA);
}


.nca_row_details{
  width: 440px;
  border-radius: var(--Border-Radius, 4px);
  border: 1px solid var(--Stroke--Grey, #E4E4E7);
  background: var(--White-BG, #FFF);
  padding: 16px 34px;
}

.nca_row_details{
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.idle-color {
  color: #18AF66;
}

.planned-color {
  color: #EDBF31;
}

.in-use-color {
  color: #18AF66;
}

.text-status-green {
  color: #18AF66;
}

.text-status-yellow {
  color: #EDBF31;
}

.text-status-red {
  color: #E83453;
}


.nac_row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}


.accumulatedDepreciation{
  border-top: 1px solid var(--Stroke--Grey, #E4E4E7);
  padding: 10px 0px;
  display: flex;
  justify-content: flex-end;
}

.nca_td_dropDown{
  padding: 0px !important;
}

.addVendorTransac{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 42px;
}

.addVendorTransac p{
  overflow: hidden;
  color: var(--Black, #1C1C1C);
  leading-trim: both;
  text-edge: cap;
  text-overflow: ellipsis;

  /* Table/Content */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 84;
  line-height: normal;
  margin-bottom: 0px;
}

.addNCA_Slider .slidingWindow_Body {
  padding-bottom: 110px;
}

.ncav2_page_container .employee_filter_container{
  margin-top: 12px;
}


/* ====================Customer Ticket======================= */

.customerTicket_page{
  background-color: white;
}

.customer_Ticket_Form_container{
  margin: 20px;
  width: 450px;
  min-height: 300px;
} 

.customer_Ticket_Form_container::-webkit-scrollbar{
  display: none;
}

.customer_Ticket_Form_container{
  padding: 20px;
  border:  1px solid #E4E4E7;
  border-radius: 10px;
}

.ticket_Form{
  margin-top: 10px;
}

.serviceLogs_filters{
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.serviceLogs_card_container{
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;

}

.serviceLogs_card{
  border-bottom: 1px solid var(--Stroke--Grey, #E4E4E7);
  padding: 10px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.customerTicket_page h3{
  color: var(--Black, #1C1C1C);

  /* Table/Content(B) */
  font-family: 'Geist-Medium';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-bottom: 0px;
}


.customerTicket_page p{
  color: var(--Black, #1C1C1C);

  /* Table/Content(B) */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin: 5px 0px;
}

.customerTicket_page span{
  color: var(--Black, #1C1C1C);

  /* Table/Content(B) */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
}


.serviceLogDetails_container{
  margin: 20px;
  width: 450px;
  min-height: 300px;
  padding: 20px;
  border:  1px solid #E4E4E7;
  border-radius: 10px;
}


.serviceLogs_header{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.requestType{
  margin-top: 16px;
}


/* =========================Accurual==================== */

.accounting_periods_table_indicator{
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.table_indicator{
  display: flex;
  align-items: center;
  gap: 8px;
}

.table_indicator .cellName{
  padding: 10px;
  color: var(--Black, #1C1C1C);

  /* Table/Content(B) */
  font-family: 'Geist-Regular';
  font-size: 14px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;

  margin-bottom: 0px;
}


.table_indicator p{
  color: var(--Black, #1C1C1C);

  /* Table/Content(B) */
  font-family: 'Geist-Regular';
  font-size: 12px;
  font-style: normal;
  font-weight: 106;
  line-height: normal;
  margin-bottom: 0px;
}



@media screen and (max-width:950px){

  .dashboardv2_filters{
    flex-wrap: wrap;
  }

  .dashboardv2_filter_dropdown .toggle_dropdown_btn{
    display: flex;
    align-items: center;
  }

  .dashboardv2_filter_dropdown .toggle_dropdown_btn p{
    margin-bottom: 0px;
    width: fit-content;
  }


  .custom_width_chosen_container{
    width: auto !important;
  }

  .dashboardv2_metrics{
    width: fit-content;
    min-width: 246px;
  }

  .dashboardv2_charts{
    width: 100%;
  }

  .dayx_dashboard_table{
    display: flex;
    flex-direction: column;
    height: auto;
  }

  .dashboard-table-container{
    height: auto;
    flex: 1 1 0;
  }

  .dayx_dashboard_table_tabs{
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
  }

  .dayx_dashboard_table_tabs .forecastingv2_tabs{
    font-size: 12px;
  }


  .insight_title{
    flex-direction: column;
    gap: 6px;
    align-items: flex-start;
  }

  .dashboardv2_charts_container{
    flex-direction: column;
  }


  .dashboardv2_header{
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }


  .dashboardv2_filters_buttons{
    flex-wrap: wrap;
  }

  .employee_filter_container{
    flex-wrap: wrap;
  }

  .dashboardv2_custom_datepicker span{
    display: block;
    min-width: fit-content;
  }

  .table_actions_div, .table_action_btn_container {
    visibility: visible;
  }


}

@media screen and (max-width: 600px){

  /* =================================Sign up screen======================= */

  .sign_up_page .dayx_form_input_container{
    flex-direction: column;
    width: 100%;
  }

  .sign_up_page .dayx_form_input_container .form_input{
    width: 100%;
  }



  /* =====================================Side Nav================================== */


  #sidenavbar-container{
    display: none;
    position: absolute;
  }

  .resp_header{
    display: flex;
    padding: 10px 20px;
    background-color: white;
  }

  .main-container{
    flex-direction: column;
  }

  #sidenavbar-container {
    display: flex;
    flex: 0 0 250px;
  }
  
  #sidenavbar-container.closed {
    flex: 0 0 0px;
  }

  .sidenavbar.closed{
    width: 0px;
    display: none;
  }

  .main-content{
    flex: none;
  }


  /* ==================================Dashboard Screen========================= */

  .dashboardv2_filters{
    flex-wrap: wrap;
  }

  .dashboardv2_filter_dropdown .toggle_dropdown_btn{
    display: flex;
    align-items: center;
  }

  .dashboardv2_filter_dropdown .toggle_dropdown_btn p{
    margin-bottom: 0px;
    width: fit-content;
  }


  .custom_width_chosen_container{
    width: auto !important;
  }

  .dashboardv2_metrics{
    width: fit-content;
    min-width: 246px;
  }

  .dashboardv2_charts{
    width: 100%;
  }

  .dayx_dashboard_table{
    display: flex;
    flex-direction: column;
    height: auto;
  }

  .dashboard-table-container{
    height: auto;
    flex: 1 1 0;
  }

  .dayx_dashboard_table_tabs{
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
  }

  .dayx_dashboard_table_tabs .forecastingv2_tabs{
    font-size: 12px;
  }


  .insight_title{
    flex-direction: column;
    gap: 6px;
    align-items: flex-start;
  }




  .dashboardv2_header{
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }


  .dashboardv2_filters_buttons{
    flex-wrap: wrap;
  }

  .employee_filter_container{
    flex-wrap: wrap;
  }

  .dashboardv2_custom_datepicker span{
    display: block;
    min-width: fit-content;
  }

  .table_actions_div, .table-action_btn_container {
    visibility: visible;
  }

  /* .dashboardv2_header_btn_container{
    flex-wrap: wrap;
    align-items: flex-start;
  } */

  /* ===================Sliding Windows======================= */

  .employee_slider{
    width: 100%;
  }


  /* ===============Personnel============================== */

  .personnel_graph_payrun_container{
    flex-direction: column;
  }

  .personnel_graph_container{
    width: 100%;
  }

  .personnel_payrun_container{
    width: 100%;
  }

  .personnel_overview  .dashboardv2_custom_datepicker span{
    max-width: 120px !important;
    min-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .personnel_graphs{
    flex-wrap: wrap;
  }

  .personnel_overview_graph{
    width: 100%;

  }

  .personnel_actual_payroll_graph{
    width: 100%;
  }

  .payrunDate h3{
    font-size: 12px;
  }

  .payPeriod p{
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .runPayroll_Details_container{
    flex-wrap: wrap;
  }

  .payrollHistory{
    width: 100%;
    height: 400px;
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  .draftedPayments{
    width: 100%;
    width: 100%;
    height: 400px;
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }


  /* ==========================Chatbot======================== */


  .chatbotpage_container{
    flex-wrap: wrap;

  }

  .chatbotpage_body{
    width: 100%;
  }

  .chatbot_history{
    width: 100%;
  }


  .reports_page_container{
    flex-direction: column;
  }

  .reports_page_container .reports_tables_container{
    width: 100%;
    flex: none;
  }

  .reports_page_container .reports_favorites{
    width: 100%;
  }

  .dashboardv2_custom_datepicker .selected-dates span{
    max-width: 100px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: no-wrap;
    min-width: auto;
  }


  /* ========================Settings============================== */

  .settings_tab_container{
    flex-direction: column;
    align-items: flex-start;
    /* padding: 0px 20px; */
  }

  .settings_tab_body{
    min-height: fit-content;
    width: 100%;
  }

  .settings_tabs{
    height: fit-content;
    display: flex;
    align-items: center;
    overflow-x: scroll;
    padding: 0px;
    width: 100%;
    -ms-overflow-style: none;
    scrollbar-width: none;
    border-right: none;
    padding: 0px 20px 16px 20px;
    border-bottom: 1px solid #E4E4E7;
  }

  .settings_tabs::-webkit-scrollbar{
    display: none;
  }

  .tab_w-550,.tab_w-680{
    width: 100%;
  }

  .settings_tabs .settings_tab_card{
    min-width: fit-content;
  }

  .settings_tabs .settings_tab_card h3{
    min-width: fit-content;
  }

  .settings_tabs .settings_tab_card.active{
    border-bottom: 5px solid var(--Accent, #8617AA);
    border-right: none;
  }

  .setting_tabs_bodyDetails {
    padding: 0px 20px 30px 20px;
  }

  .company_Profile_Details{
    margin: 0px;
    margin-top: 10px;
  }


  .accessManagement_tab_container{
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .forecastingv2_tabs{
    font-size: 12px;
  }





  /* =====================Exception Reporting========================= */

  .exceptionReporting_table_notification_container{
    flex-direction: column;
  }

  .exceptionReporting_table_container{
    width: 100%;
  }


  .exceptionReporting_notification{
    width: 100%;
  }

  .dashboardv2_filters_buttons .employee_search_input{
    width: 200px;
    flex: none !important;
  }
  

  /* ========================Onboarding form========================= */

  .onboarding_form{
    width: 100%;
  }

  .onboard_start_end{
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  .onboard_comp_date{
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .onboard_comp_date_divider{
    display: none;
  }

  .onboard_comp_date input{
    margin-left: 0px;
    width: 100%;
  }

  /* =====================Customer Ticket========================= */

  .customer_Ticket_Form_container{
    width: 100%;
    margin: 0px;
  }

  .padding-20{
    padding: 20px;
  }

  .serviceLogDetails_container{
    margin: 0px;
    width: 100%;
  }
}

.get-started-button {
  background-color: #000;
  color: white;
  border-radius: 25px;
  padding: 10px 20px;
  border: none;
  font-size: 14px;
  display: flex;
  align-items: center;
}

.getStarted {
  background-color: red;
  color: white;
  border-radius: 190px;
  margin-left: 6px;
  font-size: 14px;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}



.complete_onboarding{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 32px;
  padding-bottom: 20px;
}

.welcome_onboarding_class .modal-content{
  width: fit-content;
}

.welcome_onboarding_class .modal-dialog{
  width: fit-content;
}

.complete_onboarding .btn_outline{
  margin-left: 0px;
}

.coa_td{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
}

.add_Coa_btn{
  visibility: hidden;
  padding: 10px;
}

.coa_table_container tbody td:hover .add_Coa_btn{
  visibility: visible;
  cursor: pointer;
  padding: 10px;
}

/* .price_Input{
  min-width: 100px;
  max-width: fit-content;
} */

/* .chosen_select_div .chosen-container{
  position: absolute;
} */

.journalEntry_table_container .table-wrapper{
  overflow-x: visible;
}

.journalEntry_table_container .table-container{
  overflow: visible;
}



.journalEntry_table_container::-webkit-scrollbar {
  display: block;
  height: 8px;
  width: 8px;
}

.journalEntry_table_container::-webkit-scrollbar-thumb {
  background: var(--line-color);
  border-radius: 10px;
}

.journalEntry_table_container .table-container{
  background-color: transparent;
}


.overflowHidden_Container{
  width: 100%;
  overflow: visible;
}

.journalEntry_page{
  padding-right: 20px;
  overflow-x: hidden;
}

.journalEntry_table_container .chosen-container .chosen-results{
  max-height: 140px;
}

.journalEntry_table_container .chosen-container .chosen-drop{
  width: fit-content !important;
}

.height-change-normal {
  height: 90px;
}

.height-change-auto {
  height: auto;
}
