@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap");

html {
  scroll-behavior: smooth;
  font-size: 62.5%;
}

* {
  margin: 0;
  padding: 0;
  list-style: none;
}

*:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
  border-radius: 10px;
}

::-webkit-scrollbar-track {
  background: var(--e-global-before-light-border-color);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background: #8c9cba;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: #8c9cba;
  border-radius: 10px;
}

:root {
  --body-font-family: "Open Sans", sans-serif;
  --e-global-color-white: #fff;
  --e-global-color-black: #000;
  --e-global-before-login-background: #fafbfd;
  --e-global-color-dark-blue: #092344;
  --e-global-color-blue-button-color: #186fd9;
  --e-global-before-sidebar-background: #07273f;
  --e-global-before-sidebar-text-color: #bdc5d0;
  --e-global-before-rightbar-text-color: #1a1a1a;
  --e-global-before-light-border-color: #e1e8f4;
  --e-global-before-dark-green: #26a071;
  --e-global-before-dark-red: #cb4d42;
}

h1 {
  color: black;
  font-weight: bold;
}

.loadingScreen {
  width: 20%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  left: 40%;
  top: 0;
  z-index: 99999;
}

.loadingScreen .spinner-grow {
  width: 4rem !important;
  height: 4rem !important;
}

.loadingScreen .spinner-border {
  width: 4rem !important;
  height: 4rem !important;
}

img {
  max-width: 100%;
}

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

a,
a:hover {
  text-decoration: none;
}

input:focus,
select:focus {
  outline: none !important;
  box-shadow: none !important;
  border-color: var(--e-global-color-blue-button-color) !important;
}

body {
  font-size: 1.4rem;
  line-height: 2.5rem;
  font-weight: 400;
  overflow-x: hidden;
  color: var(--e-global-color-dark-blue);
  font-family: var(--body-font-family);
}

.before_login_screen {
  width: 100vw;
  min-height: 100vh;
  padding: 5rem;
  background: var(--e-global-before-login-background);
  display: flex;
  align-items: center;
  justify-content: center;
}

.before_main_login_box {
  width: auto;
  height: auto;
}

.before_logo {
  width: 15rem;
  text-align: center;
  margin: auto auto 4rem;
}

.login_box {
  width: 55rem;
  height: auto;
  padding: 2rem;
  border-radius: 1rem;
  background: var(--e-global-color-white);
  box-shadow: 0px 6px 20px #00000029;
}

.before_login_heading {
  width: 100%;
  padding: 0 1.5rem;
  margin-bottom: 4rem;
}

h1 {
  font-size: 2.4rem;
  font-weight: bold;
  line-height: normal;
  margin-bottom: 1rem;
}

.before_login_heading p {
  color: #677789;
}

.login_box form {
  width: 100%;
  height: auto;
}

.login_box .form-group,
.generate_new_pin_form .form-group {
  margin-bottom: 3rem;
  position: relative;
}

.login_box .form-group .input_field_wrap,
.generate_new_pin_form .input_field_wrap {
  width: 100%;
  padding: 0;
  border-radius: 0.4rem;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  position: relative;
}

.login_box .form-group .input_field_wrap label,
.generate_new_pin_form .form-group .input_field_wrap label {
  font-size: 1.4rem !important;
  font-weight: 500;
  text-transform: capitalize;
  color: var(--e-global-color-black);
  position: absolute;
  left: 1.5rem;
  cursor: auto;
  letter-spacing: 0.05rem;
  transition: all 0.2s;
}

.login_box .form-group .input_field_wrap input,
.generate_new_pin_form .input_field_wrap input {
  width: 100%;
  height: 5.5rem;
  padding: 0 1.5rem;
  font-size: 1.4rem;
  color: var(--e-global-color-black);
  border: none;
  background: transparent;
  position: relative;
  z-index: 2;
  border: solid 0.1rem #dee5f2;
  background: transparent !important;
}

.login_box .form-control-message {
  left: 0;
}

/* .login_box .form-group .input_field_wrap input:focus::placeholder,  .popup_animated_form input:focus::placeholder {
	opacity: 0;
} */

.login_box .form-group input::placeholder,
.generate_new_pin_form .form-group input::placeholder {
  font-size: 1.4rem;
  font-weight: 500;
  text-transform: capitalize;
  color: var(--e-global-color-black);
}

.onpwd {
  position: absolute;
  top: 2rem;
  right: 1rem;
  /* bottom: 0; */
  margin: auto;
  height: 2.5rem;
  z-index: 3;
  cursor: pointer;
}

.onpwd i {
  color: #dee5f2;
}

.login_box .form-group .login_button {
  background: var(--e-global-color-blue-button-color);
  color: var(--e-global-color-white);
  border-color: var(--e-global-color-blue-button-color);
  font-size: 1.6rem;
  font-weight: 600;
  height: 5rem;
}

.login_box .forgot_password {
  text-align: center;
}

.login_box .forgot_password a {
  font-weight: bold;
  color: var(--e-global-color-blue-button-color);
}

.before_login_footer_menu {
  width: 100%;
  margin-top: 5rem;
}

.before_login_footer_menu ul {
  display: flex;
  align-items: center;
  justify-content: center;
}

.before_login_footer_menu ul li {
  padding: 0 1.5rem;
  line-height: 1.6rem;
  font-weight: 500;
  font-size: 1.6rem;
}

.before_login_footer_menu ul li:not(:last-child) {
  border-right: solid 0.1rem #5f6f8d;
}

.before_login_footer_menu ul li a {
  color: var(--e-global-color-blue-button-color);
}

/*--- manage user css start ---*/

.manage_dashboard {
  width: 100%;
  min-height: 100vh;
  display: block;
  background: var(--e-global-before-login-background);
}

.left_sidebar {
  width: 22rem;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9998;
  transition: 0.2s;
  background: #fcfcfd;
}

.hide_sidebar {
  width: 0;
}

.hide_sidebar .left_sidebar_top,
.hide_sidebar .sidebar_menu {
  padding: 0;
}

.hide_sidebar .sidebar_menu {
  display: none;
}

.left_sidebar_top {
  width: 100%;
  padding: 1.7rem;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.dashboard_logo {
  width: 10rem;
}

.dashboard_logo a {
  display: block;
}

.dashboard_logo a img {
  max-width: 100%;
}

.toggle_design {
  width: 2.8rem;
  display: flex;
  flex-wrap: wrap;
  position: relative;
  cursor: pointer;
}

.toggle_design span {
  width: 80%;
  height: 0.1rem;
  display: inline-block;
  margin: 0.25rem 0;
  background: var(--e-global-before-sidebar-text-color);
}

.toggle_design span:first-child {
  margin-top: 10;
}

.toggle_design span:last-child {
  margin-bottom: 0;
}

.toggle_design:before {
  font-family: var(--fa-style-family, "Font Awesome 6 Pro");
  content: "\f104";
  position: absolute;
  left: -1.3rem;
  top: -0.4rem;
  font-size: 1.6rem;
  color: var(--e-global-before-sidebar-text-color);
}

.hide_sidebar .toggle_design {
  position: absolute;
  right: -5rem;
  top: 57%;
}

.hide_sidebar .toggle_design:before {
  content: "";
  color: var(--e-global-before-rightbar-text-color);
  background-image: url(../images/menu.svg);
  background-repeat: no-repeat;
  width: 20px;
  height: 20px;
  display: block;
  background-size: 100% auto;
  top: 0.4rem;
}

.hide_sidebar .toggle_design span {
  display: none;
}

.sidebar_menu {
  width: 100%;
  padding: 2rem 0;
  border-color: var(--e-global-before-sidebar-text-color);
}

.sidebar_menu h6 {
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--e-global-color-white);
}

.sidebar_menu ul li {
  width: 100%;
  padding: 0 2rem;
}

.sidebar_menu ul li a {
  color: var(--e-global-before-sidebar-text-color);
}

.sidebar_menu ul li.active a {
  color: var(--e-global-color-white);
  font-weight: 600;
}

.top_border {
  border-width: 0.1rem 0 0 0;
  border-style: solid;
}

.right_sidebar {
  height: 100vh;
  width: calc(100% - 22rem);
  margin-left: 22rem;
  transition: 0.1s;
  padding-top: 4.5rem;
}

.full_dashboard {
  width: 100%;
  margin: 0;
}

.top_header {
  position: fixed;
  top: 0;
  z-index: 998;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 3rem;
  /* box-shadow: 0 0.1rem 0.3rem #00000029; */
  background: var(--e-global-color-white);
  width: calc(100% - 22rem);
}

.top_header_blank {
  width: 100%;
  position: absolute;
  top: 0;
  z-index: 998;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 3rem;
  background-color: transparent;
}

.full_dashboard .top_header {
  padding: 1rem 3rem 1rem 5rem;
  width: 100%;
}

.top_heading h2 {
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: bold;
  text-transform: capitalize;
  color: var(--e-global-before-rightbar-text-color);
}

.top_right ul {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.top_right ul li {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: #f0f4fb;
  margin-left: 1rem;
  border: solid 0.1rem var(--e-global-before-light-border-color);
}

.top_right ul li a {
  width: 100%;
  height: 100%;
  font-size: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--e-global-before-rightbar-text-color);
}

.right_sidebar_body {
  height: calc(100%);
  width: 100%;
  /* padding: 3rem; */
}

.navigation-option {
  display: "flex";
  flex-direction: "row";
  align-items: "center";
  justify-content: "center";
  box-shadow: "none";
  width: "10rem";
  height: "3rem";
  cursor: "pointer";
  font: "normal normal 600 17px/24px Open Sans";
  font-size: "1rem";
  margin: "0 1rem";
  overflow: "hidden";
  border-radius: 4;
}

.account-icon {
  border-radius: 100%;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: bold;
  color: white;
  background-color: #07273f;
}

.account-icon:hover {
  background-color: #1a6fd9;
}

.account-icon:focus {
  background-color: #1a6fd9;
}

.navigation-option-img {
  margin-right: 2;
  width: 12.5;
  height: 12.5;
  object-fit: "contain";
}

.header_dropdown_li {
  position: relative;
}

.header_dropdown_li a {
  border-radius: 100%;
  background-color: #07273f;
}

.header_dropdown_li a:hover {
  background-color: #1a6fd9;
}

.header_dropdown_li a:focus {
  background-color: #1a6fd9;
}

.header_dropdown_li ul {
  flex-direction: column;
}

.header_dropdown_li ul.custom_dropdown li {
  border-radius: 0px;
  background-color: transparent;
  border: none;
  margin: 0;
}

.top_middle {
  width: 100%;
  margin-bottom: 3rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  position: relative;
}

.top_middle_left a {
  padding: 0.7rem 2.5rem;
  display: block;
  border-radius: 0.5rem;
  font-weight: 600;
  text-transform: capitalize;
  color: var(--e-global-color-white);
  background: var(--e-global-color-blue-button-color);
}

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

.top_middle_search {
  display: flex;
  overflow: hidden;
  border-radius: 1.5rem;
  padding: 0rem 1rem;
  margin-right: 1.5rem;
  background: var(--e-global-color-white);
  border: solid 0.2rem var(--e-global-before-light-border-color);
}

.top_middle_search input {
  min-width: 8rem;
  height: 2.4rem;
  border: none;
}

.top_middle_search input::placeholder {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--e-global-before-rightbar-text-color);
}

.top_middle_search button {
  width: 2rem;
  border: none;
  font-size: 1rem;
  background: var(--e-global-color-white);
}

.top_middle_search button:focus {
  outline: none;
}

.top_middle_filter {
  display: flex;
  width: 6rem;
  border: solid 0.2rem var(--e-global-before-light-border-color);
  border-radius: 1.5rem;
  font-size: 1rem;
  justify-content: space-between;
  padding: 0rem 0.6rem;
  color: var(--e-global-before-rightbar-text-color);
  font-weight: 600;
}

.filter_popup {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 2rem;
}

.filter_popup .react-datepicker-wrapper,
.filter_popup .filter-box {
  margin-right: 15px;
}

.filter_popup input,
.filter_popup select {
  width: 100%;
  height: 4rem;
  border: solid 0.1rem var(--e-global-before-light-border-color);
  border-radius: 0.5rem;
}

.table_main {
  width: 100%;
  min-height: 70vh;
  position: relative;
  border-radius: 0.5rem;
  background: var(--e-global-color-white);
  border: solid 0.1rem var(--e-global-before-light-border-color);
  overflow: hidden;
}

/* .table_main .infinite-scroll-component__outerdiv {
	position: absolute;
	width: 100%;
	top: 4.5rem;
	left: 0;
} */

.shiftlisting-footer {
  border-top: 1px solid #e1e8f4;
  margin-top: auto;
  flex-grow: 1;
  font-size: 13px;
  color: #6a7c9a;
  padding: 0px 18px;
  padding-top: 6px;
}

.table_main table {
  width: 100%;
  border-radius: 0.5rem;
}

.table_main table thead {
  background: #f2f7ff;
}

.table_main table tr {
  border-bottom: solid 0.1rem var(--e-global-before-light-border-color);
}

.table_main table thead th {
  font-weight: bold;
  font-size: 12px;
  color: var(--e-global-before-rightbar-text-color);
}

.table_main table thead th,
.table_main table tbody td {
  padding: 1rem;
  line-height: normal;
}

.table_main table tbody td {
  font-size: 12px;
  color: var(--e-global-before-rightbar-text-color);
}

.table_main .status {
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  margin-right: 0.4rem;
  display: inline-block;
}

.status.inactive {
  background: #cb4d42;
}

.status.invited {
  background: #e6a901;
}

.status.active {
  background: #38c378;
}

.all_popup {
  width: 100vw;
  height: 100vh;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 99999;
  background: transparent;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}

.add_new_user_box {
  width: 100%;
  max-width: 660px;
  padding: 2rem 2rem;
  border: solid 0.1rem var(--e-global-before-light-border-color);
  background: var(--e-global-color-white);
  box-shadow: 0px 10px 14px #0000001a;
  height: 90vh;
}

.add_new_user_boxInner {
  height: auto;
}

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

.active_user {
  display: block;
}

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

.modalDone {
  cursor: pointer;
  margin-right: 10px;
  background-color: #186fd9;
  color: #ffffff;
  font-size: 12px;
  font-weight: bold;
  padding: 2px 16px;
  border-radius: 15px;
}

.modalClose {
  cursor: pointer;
}

.add_new_user_box_top_heading h3 {
  font-size: 16px;
  font-weight: bold;
  margin: 0;
  color: #1a1a1a;
}

.add_new_user_box_top_right button {
  min-width: 10rem;
  height: auto;
  text-align: center;
  padding: 0.8rem 0.6rem;
  border: solid 0.1rem;
  border-radius: 0.4rem;
  font-size: 1.4rem;
  font-weight: 600;
  text-transform: capitalize;
}

.add_new_user_box_top_right .discard {
  border-color: #b3c8ed;
  color: var(--e-global-color-blue-button-color);
  background: var(--e-global-color-white);
  margin-right: 0.5rem;
  border-radius: 4px;
  padding: 0.8rem 2rem;
}

.add_new_user_box_top_right .save {
  border-color: var(--e-global-color-blue-button-color);
  color: var(--e-global-color-white);
  background: var(--e-global-color-blue-button-color);
}

.add_new_user_box_top_right button:focus {
  outline: none;
  box-shadow: none;
}

.add_new_user_box_middle {
  width: 100%;
  margin-top: 1rem;
  /* height: 435px;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 1rem; */
}

.add_new_user_box_middle .form-group {
  margin-bottom: 1.2rem;
}

.add_new_user_box_middle .form-group .form-control-message {
  position: relative;
  left: 0;
  width: 100%;
  float: left;
}

.add_new_user_box_middle .form-group .col-md-4 {
  display: flex;
  align-items: center;
}

.add_new_user_box_middle .form-group label {
  font-size: 1.3rem;
  font-weight: 500;
  margin: 0;
  display: flex;
  align-items: center;
  height: 100%;
}

.add_new_user_box_middle .form-group input,
.add_new_user_box_middle .form-group select {
  width: 100%;
  padding: 0 1rem;
  font-weight: 600;
  height: 4rem;
  border-radius: 0.4rem;
  border: solid 0.1rem var(--e-global-before-light-border-color);
}

.add_new_user_box_middle .form-group input[type="number"] {
  background: #fff;
}

.add_new_user_box_middle .form-group input:disabled {
  background: #e1e4ea;
  cursor: not-allowed;
}

.add_new_user_box_middle .form-group select:focus {
  outline: none;
  box-shadow: none;
}

.add_productive_hours .my-form-group select {
  width: 100%;
  padding: 0 1rem;
  font-size: 1rem;
  border-radius: 0.4rem;
  border: solid 0.1rem var(--e-global-before-light-border-color);
}

.add_productive_hours .my-form-group select:focus {
  outline: none;
  box-shadow: none;
}

.action_popup {
  width: 35%;
  position: absolute;
  top: 0;
  right: 0;
  border: solid 0.1rem var(--e-global-before-light-border-color);
  background: var(--e-global-color-white);
  box-shadow: 0px 10px 14px #0000001a;
  display: none;
  /* height: 100%; */
}

.action_popup_top {
  width: 100%;
  padding: 2rem 3rem;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: solid 0.1rem var(--e-global-before-light-border-color);
}

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

.status_activation {
  position: relative;
  width: 9rem;
  height: 3rem;
}

.switch {
  display: inline-block;
  width: 9rem;
  height: 3rem;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

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

.switch .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--e-global-before-dark-red);
  -webkit-transition: 0.4s;
  transition: 0.4s;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  color: var(--e-global-color-white);
  padding-left: 0;
  padding-right: 1rem;
}

.switch .slider:before {
  position: absolute;
  content: "";
  height: 2rem;
  width: 2rem;
  left: 0.7rem;
  bottom: 0;
  top: 0;
  margin: auto;
  background-color: white;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.switch input:checked + .slider {
  background-color: var(--e-global-before-dark-green);
  justify-content: flex-start;
  padding-left: 1rem;
  padding-right: 0;
}

.switch input:focus + .slider {
  box-shadow: 0 0 1px var(--e-global-before-dark-green);
}

.switch input:checked + .slider:before {
  -webkit-transform: translateX(5.6rem);
  -ms-transform: translateX(5.6rem);
  transform: translateX(5.6rem);
}

.switch .slider.round {
  border-radius: 3.4rem;
}

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

.action_popup_top_right_dotted {
  margin: 0 2rem;
  position: relative;
}

.action_popup_top_right_dotted i {
  font-size: 1.8rem;
}

.action_popup_top_right_dotted .dotted_listing {
  width: 12rem;
  position: absolute;
  top: 105%;
  right: 0;
  z-index: 9;
  border-radius: 0;
  box-shadow: 0.1rem 0.4rem 1rem #00000029;
  background: var(--e-global-color-white);
  border: solid 0.1rem var(--e-global-before-light-border-color);
}

.three_dot_extra_class:hover {
  background-color: #677789;
}

.user_action_popup {
  width: 12rem;
  height: 12rem;
  position: absolute;
  top: 105%;
  right: 0;
  z-index: 9;
  border-radius: 4px;
  box-shadow: 0.1rem 0.4rem 1rem #00000029;
  background: var(--e-global-color-white);
  border: solid 0.1rem var(--e-global-before-light-border-color);
}

.user_action_popup_row_hover:hover {
  background-color: #e1e8f4;
}

.action_popup_top_right_dotted .dotted_listing ul li {
  padding: 0.5rem 1rem;
}

.action_popup_middle {
  width: 100%;
  padding: 2rem 4rem;
}

.action_popup_middle span {
  font-size: 1.4rem;
  text-transform: capitalize;
}

.action_popup_middle label {
  font-size: 1.4rem;
  font-weight: 700;
  margin: 0;
  text-transform: capitalize;
  word-break: break-word;
}

.action_popup_middle label.emailLabel {
  text-transform: lowercase;
}

.generate_new_pin {
  justify-content: center;
  text-align: center;
  border-radius: 0.5rem;
  font-weight: 700;
  font-size: 1.4rem;
  padding: 0 1rem;
  cursor: pointer;
  color: var(--e-global-color-blue-button-color);
  border: solid 0.1rem var(--e-global-before-light-border-color);
}

.full_modal {
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgb(7, 22, 41, 0.8);
  display: none;
}

.generate_new_pin_active {
  display: flex;
}

.generate_new_pin_box {
  width: 35rem;
  padding: 4rem;
  border-radius: 1rem;
  position: relative;
  text-align: center;
  box-shadow: 0px 6px 20px #00000029;
  background: var(--e-global-color-white);
  display: block;
  z-index: 999;
}

.generate_new_pin_box h4 {
  font-size: 2rem;
  font-weight: 700;
  /* text-transform: capitalize; */
  color: var(--e-global-color-dark-blue);
}

.generate_new_pin_form {
  margin-top: 2rem;
}

.generate_new_pin_form .add_new_user_box_top_right {
  margin-top: 2rem;
}

.user_profile_popup {
  width: 15rem;
  /* display: none; */
  position: absolute;
  top: 100%;
  right: 0rem;
  top: 60px;
  border-radius: 0.4rem;
  z-index: 999;
  box-shadow: 1px 3px 4px #00000029;
  background: var(--e-global-color-white);
  border: solid 0.1rem var(--e-global-before-light-border-color);
}

.user_profile_popup ul li {
  width: 100%;
  text-transform: capitalize;
}

.user_profile_popup ul li:hover {
  background: var(--e-global-before-light-border-color);
}

.user_profile_popup ul li a {
  padding: 0.5rem 1rem;
  display: block;
  width: 100%;
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--e-global-before-rightbar-text-color);
  text-transform: initial;
  display: flex;
  justify-content: flex-start;
}

/*--- My Account Page ---*/

.my_account_page {
  width: 100%;
  height: calc(100vh - 13rem);
  display: flex;
  align-items: center;
  justify-content: center;
}

.my_account_box {
  width: 53.4rem;
  text-align: left;
  padding: 5rem 5.8rem;
}

.my_account_box .col-md-3 {
  padding: 0;
}

.popup_animated_form input {
  border: none;
  text-align: left;
}

.popup_animated_form .add_new_user_box_top_right {
  margin-top: 2rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.my_account_box h4 {
  text-align: center;
  margin-bottom: 3rem;
}

/*  shift planning style */

.shit_top {
  width: 100%;
  flex-wrap: nowrap;
  justify-content: space-between;
  margin-bottom: 2rem;
}

.shit_top ul {
  display: flex;
  width: calc(100% - 0rem);
  border-bottom: solid 0.1rem var(--e-global-before-light-border-color);
}

.shit_top ul li {
  font-size: 1.4rem;
  font-weight: bold;
  padding: 0 1.5rem;
  color: #6a7c9a;
}

.shit_top ul li:first-child {
  padding-left: 0;
}

.shit_top ul li a {
  color: #6a7c9a;
  display: block;
  padding: 0 0 0.5rem;
  border-bottom: solid 0.2rem transparent;
}

.shit_top ul li.active a {
  border-color: var(--e-global-color-blue-button-color);
  color: var(--e-global-color-blue-button-color);
}

.daily_button {
  margin-left: 1rem;
}

.daily_button a {
  padding: 0.3rem 1.4rem;
  display: block;
  border-radius: 2rem;
  font-size: 12px;
  font-weight: bold;
  text-transform: capitalize;
  color: var(--e-global-color-white);
  background: var(--e-global-color-blue-button-color);
}

.table_shift_plan table thead {
  position: sticky;
  top: 0;
  z-index: 99;
  border-bottom: 1px solid black !important;
}

.table_shift_plan_listing tbody tr.active {
  border: solid 0.3rem #186fd9;
}

.table_shift_plan table thead tr th {
  position: relative;
}

.table_shift_plan_listing table thead tr th {
  border: none;
}

.table_shift_plan table tr th,
.table_shift_plan table tr td {
  padding: 1rem 1.5rem;
}

.table_shift_plan table .subHeading th {
  padding: 0;
}

.table_shift_plan tr.left_green td:first-child {
  position: relative;
}

.table_shift_plan tr.left_green td:first-child::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 0;
  width: 3px;
  height: 100%;
  background-color: green;
  display: block;
}

.table_shift_plan table thead th:nth-child(10) {
  width: 15%;
}

.table_shift_plan table tbody td:nth-child(12) {
  width: 15%;
}

.table_shift_plan table tbody td:nth-child(14) {
  width: 3%;
  text-align: center;
}

.table_shift_plan table thead tr th:nth-last-child(2) {
  border-right: none !important;
}

.table_shift_plan table thead tr th:last-child {
  border-left: none !important;
}

.table_shift_plan table tbody td {
  white-space: break-spaces !important;
  word-break: break-all !important;
  width: 14rem;
}

.shift_green {
  background: #f0fcf5;
  border-left: solid 0.2rem #3ac49f;
}

.shift_red {
  background: #ffeded;
  border-left: solid 3px #eb5f5f;
}

.ongoing {
  color: #26a071;
}

.published {
  color: #186fd9;
}

.draft {
  color: #e58d00;
}

.ended {
  color: #6a7c9a;
}

.new_daily_plan_heading h3 i {
  cursor: pointer;
}

.new_daily_plan_heading h3 {
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--e-global-color-black);
}

.new_daily_plan table {
  border-color: var(--e-global-before-light-border-color);
}

.new_daily_plan .shift_table tr td {
  padding: 0.8rem 1.5rem !important;
  border-right: solid 0.1rem var(--e-global-before-light-border-color) !important;
}

.new_daily_plan .shift_table tr td:last-child {
  border: none !important;
}

.new_daily_plan .shift_table tr td span {
  width: 9.5rem;
  display: inline-block;
  max-width: 9.5rem;
  vertical-align: top;
}

.new_daily_plan .shift_table tr td b {
  width: calc(100% - 9.5rem);
  display: inline-block;
  vertical-align: top;
}

.shift_table tr,
.shift_table tr td {
  border: none !important;
  padding: 1rem 1rem !important;
  font-size: 1.2rem !important;
}

.new_daily_plan_heading .daily_button a {
  border: solid 0.2rem var(--e-global-color-blue-button-color);
  background: var(--e-global-color-white);
  font-weight: 700;
  color: var(--e-global-color-blue-button-color);
}

.excavators table tr:nth-child(even) {
  background: #f8fafd;
}

.excavators table tr:nth-child(n + 2) td:first-child {
  padding: 0;
}

.excavators table tr:nth-child(n + 2) td:first-child .exc_number {
  width: 100%;
  padding: 0.5rem 1rem;
  display: block;
  font-weight: 700;
  color: var(--e-global-color-blue-button-color);
  border-bottom: solid 0.1rem var(--e-global-before-light-border-color);
  text-align: left;
}

.excavators table tr:nth-child(n + 2) td:first-child p {
  width: 100%;
  padding: 0.5rem 1rem;
}

.excavators table tr.active {
  border: solid 0.2rem #186fd9;
  border-left: none;
  border-top-left-radius: 0;
  vertical-align: top;
}

.excavators table tr.disabled td {
  opacity: 0.5 !important;
  pointer-events: none;
}

.excavators table tr.active span.exc_number {
  background: var(--e-global-color-blue-button-color);
  color: #fff !important;
}

.excavators table tr.warning span.exc_number {
  color: #e03c3c !important;
  background-color: #ffeded;
  position: relative;
}

.excavators table tr.warning span.exc_number::before {
  width: 4px;
  height: 100%;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  background-color: #3ac49f;
}

.excavators table tr.warning span.exc_number img {
  position: absolute;
  right: 6px;
  width: 19px;
}

.excavators table tr.active td:first-child {
  border: solid 0.2rem #186fd9;
  border-top-right-radius: 0;
  border-right: none;
  height: 76px;
  margin-top: -2px;
}

.excavators table tr.active td {
  border-color: var(--e-global-before-light-border-color);
}

/* .excavators table tr td p{
  height: 3.2rem;
  margin-bottom: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
} */

.custom_radio {
  display: block;
  position: relative;
  padding-left: 2.75rem;
  margin-right: 2rem !important;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.custom_radio input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.custom_radio .checkmark {
  position: absolute;
  top: 0.75rem;
  left: 0;
  height: 2rem;
  width: 2rem;
  border-radius: 50%;
  background-color: var(--e-global-color-white);
  border: solid 0.1rem var(--e-global-before-light-border-color);
}

.custom_radio:hover input ~ .checkmark {
  background-color: var(--e-global-color-white);
}

.custom_radio input:checked ~ .checkmark {
  background-color: var(--e-global-color-white);
  border-color: var(--e-global-color-blue-button-color);
}

.custom_radio .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.custom_radio input:checked ~ .checkmark:after {
  display: block;
}

.custom_radio .checkmark:after {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 1.175rem;
  aspect-ratio: 1/1;
  /* height: 1.1rem; */
  border-radius: 50%;
  background: var(--e-global-color-blue-button-color);
}

.new_daily_plan_popup .add_new_user_box_middle .shift_tab_list {
  width: 100%;
  margin-bottom: 2rem;
}

.new_daily_plan_popup .add_new_user_box_middle .shift_tab_list ul {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  border-bottom: 1px solid var(--e-global-before-light-border-color);
}

.new_daily_plan_popup .add_new_user_box_middle .shift_tab_list ul li {
  padding: 0 1rem;
  font-size: 14px;
  font-weight: bold;
  text-transform: capitalize;
}

.new_daily_plan_popup .add_new_user_box_middle .shift_tab_list ul li.active a {
  color: #186fd9;
  border-bottom: 2px solid #186fd9;
}

.new_daily_plan_popup
  .add_new_user_box_middle
  .shift_tab_list
  ul
  li.shift_tab_list_active
  a {
  color: var(--e-global-color-blue-button-color);
  border-color: var(--e-global-color-blue-button-color);
}

.new_daily_plan_popup .add_new_user_box_middle .shift_tab_list ul li a {
  color: #6a7c9a;
  padding: 0.5rem 0;
  display: block;
  border-bottom: solid 0.2rem transparent;
}

.new_daily_plan_popup
  .add_new_user_box_middle
  .shift_tab_list
  ul
  li:first-child {
  padding-left: 0;
}

.new_daily_plan_popup
  .add_new_user_box_middle
  .shift_tab_list
  ul
  li:last-child {
  padding-right: 0;
}

.big_table {
  width: auto;
  overflow-x: auto;
}

.big_table table tr th,
.big_table table tr td {
  min-width: 14rem;
  max-width: max-content;
  white-space: nowrap;
}

/* Extra style entered */

.form-control-message {
  color: red;
  text-align: left;
  display: block;
  position: absolute;
  left: 15px;
  bottom: 0;
  font-size: 12px;
}

/*  */

.close_icon {
  position: absolute;
  top: 0.5rem;
  right: 1rem;
  cursor: pointer;
}

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

.action_buttons_add_daily_plan .form-control {
  position: fixed;
  top: 10px;
  width: 100%;
  max-width: 250px;
  right: 12%;
  z-index: 999;
}

.blue_button a {
  color: var(--e-global-color-white) !important;
  background: var(--e-global-color-blue-button-color) !important;
}

.addDailyPlanTablemain {
  position: relative;
}

.addDailyPlanTablemain .all_popup {
  width: 100%;
  height: 100%;
  background-color: transparent !important;
}

.addDailyPlanTablemain .all_popup .add_new_user_box {
  margin-top: 0px;
  position: absolute;
  min-height: 124rem;
}

.addDailyPlanTablemain .all_popup .add_new_user_box .add_new_user_box_middle {
  height: calc(100% - 40px);
}

.addDailyPlanTablemain
  .all_popup
  .add_new_user_box
  .add_new_user_box_middle
  .modal_scroll {
  height: initial;
  max-height: initial;
  overflow-y: auto;
  overflow-x: hidden;
}

.addDailyPlanTablemain .title {
  background-color: #f8fafd;
  padding: 1.5rem 0.7rem;
  border: solid 0.1rem var(--e-global-before-light-border-color);
}

.addDailyPlanTablemain .title p {
  font-size: 1.1rem;
  line-height: normal;
  color: var(--e-global-color-dark-blue);
  font-weight: 700;
  margin: 0;
}

.addDailyPlanTable {
  margin-left: 14rem;
}

.addDailyPlanTable table {
  border: none;
}

.addDailyPlanTable table tr td {
  height: 74px;
  border-left: none;
  border-top: none;
  text-align: center;
  white-space: nowrap !important;
}

.addDailyPlanTable table tr td:last-child .customTooltip .customTooltip-show {
  /* display: block; */
  right: 0;
  left: initial;
  transform: translate(0px, 0px);
}

.addDailyPlanTable
  table
  tr
  td:last-child
  .customTooltip
  .customTooltip-show::after {
  left: 80%;
}

/* .addDailyPlanTable table tr:first-child td{
  height: 4rem;
} */
.addDailyPlanTable table tr td:first-child {
  position: absolute;
  left: 0;
  z-index: 5;
}

.addDailyPlanTable table tr td:first-child .ellipse_dropdown {
  position: absolute;
}

.addDailyPlanTable table tr td:first-child .ellipse_dropdown_button {
  display: none;
}

.addDailyPlanTable table tr td:first-child .ellipse_dropdown ul {
  right: initial;
  left: 14rem;
  z-index: 999;
  top: 0;
}

.addDailyPlanTable table tr td:first-child .ellipse_dropdown ul li {
  cursor: pointer;
}

.addDailyPlanTable table tr:nth-child(even) td:first-child {
  background: #fff;
}

.addDailyPlanTable table tr:nth-child(even) td:first-child {
  background: #f8fafd;
}

.excavators.addDailyPlanTable table tr:nth-child(n + 2) td:first-child p {
  padding: 0.5rem 1rem 1rem;
  border-right: solid 0.1rem var(--e-global-before-light-border-color);
  margin: 0;
  height: 42px;
  white-space: normal;
  width: 14rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.customTooltip {
  position: relative;
}

.customTooltip p {
  white-space: normal;
  width: 14rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0;
  word-break: break-word !important;
}

.customTooltip .customTooltip-show {
  display: none;
  position: absolute;
  bottom: 100%;
  background: var(--e-global-before-sidebar-background);
  color: #fff;
  padding: 5px 8px;
  border-radius: 5px;
  white-space: normal;
  width: max-content;
  max-width: 500px;
  left: 50%;
  transform: translate(-50%, 0px);
}

.customTooltip .customTooltip-show::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: var(--e-global-before-sidebar-background) transparent
    transparent transparent;
}

.customTooltip:hover .customTooltip-show {
  display: block;
}

.customTooltip:hover .customTooltip-show:empty {
  display: none;
}

.customTooltip:hover .customTooltip-show:empty::after {
  display: none;
}

.excavators.addDailyPlanTable
  table
  tr:nth-child(n + 2)
  td:first-child
  .exc_number {
  border-right: solid 0.1rem var(--e-global-before-light-border-color);
}

.calendarPopup {
  background: #ffffff;
  box-shadow: -1px 1px 6px #0000001a;
  border-radius: 10px 0px 0px 10px;
  padding: 2rem 2rem;
  width: 100%;
  max-width: 290px;
  position: absolute;
  right: 676px;
  z-index: 999;
  top: 0rem;
  display: none;
}

.calendarPopup.show {
  display: block;
}

.calendarPopup p {
  font-size: 1.6rem;
  font-weight: bold;
  margin: 0 0 15px;
  color: var(--e-global-color-dark-blue);
}

.calendarPopup .react-datepicker {
  width: 100%;
  border: none;
}

.calendarPopup .react-datepicker__month-container {
  width: 100%;
}

.calendarPopup .react-datepicker__day-name {
  font-size: 14px;
  color: #6a7c9a;
  width: 30px;
}

.calendarPopup .react-datepicker__header {
  background-color: transparent;
  border-bottom: 1px solid transparent;
}

.calendarPopup
  .react-datepicker__header__dropdown.react-datepicker__header__dropdown--scroll {
  display: none;
}

.calendarPopup .react-datepicker__current-month {
  padding: 0 0 15px;
  color: #186fd9;
  font-size: 14px;
}

.calendarPopup .react-datepicker__navigation {
  padding: 0;
  top: 13px;
}

.calendarPopup .react-datepicker__navigation-icon::before {
  border-color: #1a1a1a;
}

.calendarPopup .react-datepicker__day {
  font-size: 14px;
  color: #1a1a1a;
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.calendarPopup .react-datepicker__month {
  margin: 0rem;
}

.calendarPopup .react-datepicker__day--today,
.calendarPopup .react-datepicker__day--selected {
  background-color: var(--e-global-color-blue-button-color) !important;
  font-weight: normal;
  color: #fff !important;
  border-radius: 100% !important;
}

.calendarPopup .react-datepicker__day-names {
  display: flex;
  justify-content: space-between;
  padding: 0 0 15px;
}

.calendarPopup .react-datepicker__week {
  display: flex;
  justify-content: space-between;
}

.datePickerInput .react-datepicker__tab-loop {
  display: none;
}

.calendarPopup .formGroup {
  display: flex;
  justify-content: flex-end;
  border-top: 1px solid var(--e-global-before-light-border-color);
  padding: 20px 0 0;
  margin: 20px 0 0;
}

.btnBlueOutline {
  border: solid 0.2rem var(--e-global-color-blue-button-color);
  background: var(--e-global-color-white);
  font-weight: 600;
  color: var(--e-global-color-blue-button-color);
  padding: 0.7rem 2.5rem;
  border-radius: 0.5rem;
  text-transform: capitalize;
}

.btnBlueOutline:hover {
  background: var(--e-global-color-blue-button-color);
  color: var(--e-global-color-white);
}

.btnBlue {
  border: solid 0.2rem var(--e-global-color-blue-button-color);
  padding: 0.7rem 2.5rem;
  border-radius: 0.5rem;
  font-weight: 600;
  text-transform: capitalize;
  color: var(--e-global-color-white);
  background: var(--e-global-color-blue-button-color);
}

.btnBlue:hover {
  background: var(--e-global-color-white);
  color: var(--e-global-color-blue-button-color);
}

.calendarPopup .formGroup a {
  min-width: 100px;
  text-align: center;
  margin: 0 5px;
  padding: 0.4rem 2.5rem;
  display: flex;
  align-items: center;
}

.ellipse_dropdown {
  position: relative;
}

.ellipse_dropdown_button {
  cursor: pointer;
}

.ellipse_dropdown ul {
  position: absolute;
  border: 1px solid #e1e8f4;
  background: #ffffff;
  box-shadow: 1px 3px 4px #00000029;
  border-radius: 4px;
  padding: 10px 20px;
  right: 0;
  z-index: 5;
  min-width: 140px;
}

.ellipse_dropdown ul li {
  font-size: 12px;
  margin-bottom: 10px;
  text-align: left;
}

.box {
  width: 80%;
  border: 2px dashed;
  height: 180px;
  overflow: auto;
  scroll-behavior: smooth;
  /* <-- for smooth scroll */
}

.boxChild {
  margin: 600px 0 300px;
  width: 40px;
  height: 40px;
  background: green;
}

.shift_top_middle {
  justify-content: space-between;
}

.modal_scroll {
  height: 100%;
  max-height: 80vh;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 10px;
}

.publish_Plan_view_modal {
  height: auto;
  max-height: initial;
}

.publish_Plan_view_modal .shift_tab_list {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

.publish_Plan_view_modal .shift_tab_list ul {
  /* width: calc(100% - 185px); */
  flex: 1;
  border-bottom: solid 0.1rem var(--e-global-before-light-border-color);
}

.publish_Plan_view_modal .shift_tab_list .add_new_user_box_top_right {
  width: 180px;
}

.publish_Plan_view_modal .shift_tab_list .add_new_user_box_top_right a {
  padding: 0.7rem 2.5rem;
  display: block;
  border-radius: 0.5rem;
  font-weight: 600;
  text-transform: capitalize;
  color: var(--e-global-color-white) !important;
  background: var(--e-global-color-blue-button-color) !important;
  text-align: center;
}

.custom_select button {
  width: 100%;
  border: solid 0.1rem var(--e-global-before-light-border-color);
  box-shadow: none;
  height: 4rem;
  border-radius: 4px;
  padding: 0 1rem;
}

.custom_select .css-1v99tuv {
  font-size: 1.4rem;
  font-weight: 600;
  color: #000;
}

.custom_select .css-1wy0on6 > div {
  height: 31px !important;
}

.custom_select button + div {
  width: 100%;
}

.custom_select button + div .css-11unzgr > div {
  display: flex;
  justify-content: flex-start;
}

.custom_select button + div .css-11unzgr > div input {
  width: 20px;
  height: auto;
}

.operatorPopup {
  max-width: 430px;
  left: auto;
}

.operatorPopup h6 {
  color: #6a7c9a;
  font-size: 14px;
  position: relative;
  margin: 0 0 15px;
}

.operatorPopup h6::before {
  content: "";
  right: 0;
  height: 1px;
  width: 170px;
  background-color: #e1e4ea;
  display: block;
  position: absolute;
  top: 11px;
}

.operatorPopup select,
.operatorPopup input[type="text"] {
  width: 100%;
  padding: 0 1rem;
  font-weight: bold;
  height: 4rem;
  border-radius: 25px;
  border: solid 0.1rem var(--e-global-before-light-border-color);
}

body.overlay {
  position: relative;
}

body.overlay::before {
  content: "";
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: fixed;
  z-index: 99998;
  /* background: rgba(0, 0, 0, 0.4); */
}

.overlay .calendarPopup .react-datepicker__day--today {
  background-color: #fff !important;
  color: #000 !important;
}

.overlay .calendarPopup .react-datepicker__day--selected {
  background-color: var(--e-global-color-blue-button-color) !important;
  color: #fff !important;
}

.smallPopupoverlay {
  position: relative;
}

.smallPopupoverlay::before {
  content: "";
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: fixed;
  z-index: 999999;
  background: rgba(0, 0, 0, 0);
}

.table_manage_user .all_popup {
  width: 100%;
  background-color: transparent;
}

.table_manage_user .all_popup .add_new_user_box {
  position: absolute;
  top: 0;
  margin-top: 0px;
}

.generalPopup {
  height: initial;
}

.generalPopup .calendarPopup {
  margin-top: 16rem;
}

.addDailyPlanTablemain .all_popup #excavators_plan.add_new_user_box {
  min-height: 95rem;
  max-width: 587px;
}

.addDailyPlanTablemain .all_popup #trucks_plan.add_new_user_box {
  min-height: 95rem;
  max-width: 587px;
}

.shift_details.active {
  border: 1px solid #186fd9;
}

.date-cal {
  background: url(../images/Calendar.svg);
  background-position: 98% center;
  background-repeat: no-repeat;
  background-size: 3rem;
}

.table_shift_plan_listing .eventTd,
.table_shift_plan_listing .eventTh {
  text-align: center;
}

.table_shift_plan_listing table tbody td {
  white-space: initial !important;
  word-break: initial !important;
}

.table_shift_plan_listing .eventTd .customTooltip p {
  color: #007bff;
  font-weight: 600;
}

.shift_top_middle .daily_button {
  margin-left: 0rem;
}

.new_daily_plan table thead {
  position: initial;
  top: 0;
}

.editIcon {
  display: inline-grid;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-right: 15px;
  position: relative;
  top: 7px;
  cursor: pointer;
}

.popup_overwrite {
  position: absolute;
  left: initial;
  right: 586px;
  z-index: 999999;
}

.acrdnHeadRow {
  display: flex;
  justify-content: space-between;
}

.acrdnHeadRow .left {
  flex: 1;
  display: flex;
  align-items: center;
}

.acrdnHeadRow .left .border {
  flex: 1;
  height: 1px;
  display: block;
  background-color: var(--e-global-before-light-border-color);
  margin: 0 15px;
}

.acrdnHeadRow .left p {
  font-size: 1.3rem;
  font-weight: bold;
  color: var(--e-global-color-dark-blue);
}

.acrdnHeadRow .left p span {
  color: #26a071;
}

.acrdnHeadRow .right {
  width: 20px;
  height: 20px;
}

.acrdnHeadRow .right .expandBtn {
  background-color: #e1e8f4;
  width: 20px;
  height: 20px;
  padding: 0;
  border: none;
  outline: none;
  display: flex;
  justify-content: center;
  align-items: center;
}

.acrdnHeadRow .right .expandBtndown img {
  transform: rotate(-180deg);
}

.overlay-active-header-inner-dropdown2 {
  z-index: 999999999;
}

.overlay-active-header-inner-dropdown-div2 {
  z-index: 999999999;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: red;
}

.overlay-active-table-inner-dropdown {
  z-index: 9999999;
}

.overlay-active-table-inner-dropdown-div {
  z-index: 999999;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  display: none;
}

.overlay-active-table-inner-dropdown-div.show {
  display: block;
}

.ShiftBox {
  padding: 20px 15px;
}

.operatorSearch {
  position: relative;
}

.operatorSearch input {
  padding: 0 1.9rem 0 1rem !important;
}

.operatorSearch button {
  background: transparent;
  border: none;
  position: absolute;
  right: 20px;
  top: 9px;
}

.shift_details table .forMobile {
  display: none;
}

.loadingMachineSelect #react-select-3-placeholder,
.loadingMachineSelect .css-qc6sy-singleValue {
  font-weight: 600 !important;
  color: #000 !important;
}

.loadingMachineSelect .css-319lph-ValueContainer {
  padding: 0 1.3rem;
}

.border {
  border: solid #000;
  border-width: 0 1px;
}

.excavators {
  border-right: 0.5px solid grey;
  border-left: 0.5px solid grey;
  border-top: 0.5px solid grey;
  border-bottom: 0.5px solid grey;
  border-radius: 10px !important;
  box-shadow: 1px 2px 9px grey;
}

.hourly-excavators {
  border-top: 0.5px solid grey;
  border-radius: 10px !important;
  /* box-shadow: 1px grey; */
}

.danger-border {
  border-right: 2px solid red;
}

.excavator-buttons {
  border-radius: 5px !important;
  width: 140px;
  font-size: 20px;
  padding-bottom: 5px;
  padding-top: 5px;
  background-color: white;
  border-color: whitesmoke;
  /* box-shadow: 1px 1px 1px 1px #d3d3d3; */
  font-weight: "500";
  color: #000;
}

#button_header::-webkit-scrollbar,
#weather__hourly__forecast::-webkit-scrollbar {
  opacity: 0;
}

.excavator-buttons-selected {
  border-radius: 5px !important;
  width: 140px;
  font-size: 20px;
  padding-bottom: 5px;
  padding-top: 5px;
  background-color: #273f6e;
  border: none;
  /* box-shadow: 1px 1px 1px 1px #d3d3d3; */
  font-weight: "500";
  color: white;
}

.loader {
  display: flex;
  align-items: center;
  justify-content: center;
  position: "absolute";
  top: "50%";
  left: "50%";
  height: 100vh;
}

.shift_details table .forMobile {
  display: none;
}

.loadingMachineSelect #react-select-3-placeholder,
.loadingMachineSelect .css-qc6sy-singleValue {
  font-weight: 600 !important;
  color: #000 !important;
}

.loadingMachineSelect .css-319lph-ValueContainer {
  padding: 0 1.3rem;
}

.latest-accordian {
  height: 700px;
  overflow-y: auto;
  overflow-x: hidden;
  margin-bottom: 15px;
}

.latest {
  border-bottom: 1px solid var(--e-global-before-light-border-color);
  padding: 15px 0;
}

.latest:last-child {
  border: none;
}

.generate_new_pin_form.my_account_box .form-group {
  margin-bottom: 1.5rem;
}

.generate_new_pin_form.my_account_box .input_field_wrap {
  margin-bottom: 0px;
}

.my_account_box .add_new_user_box_top_right {
  margin-top: 0.5rem;
  /* justify-content: flex-end; */
  display: flex;
}

.my_account_box .add_new_user_box_top_right .save {
  padding: 1rem 2rem;
}

.my_account_box .add_new_user_box_top_right .discard {
  font-weight: bold;
  border-color: #b3c8ed;
  margin-right: 1rem;
}

.table_manage_user tr.active {
  /* border: solid 0.3rem #186FD9; */
  position: relative;
  border: solid 0.3rem #186fd9;
}

/* .table_manage_user tr.active::after {
  position: absolute;
  display: block;
  content: "";
  left: 0;
  bottom: 0;
  top: 0;
  right: 0;
  border: solid 0.3rem #186fd9;
} */

.table_main table tbody tr:first-child .customTooltip .customTooltip-show {
  bottom: initial;
  top: 100%;
}

.table_main
  table
  tbody
  tr:first-child
  .customTooltip
  .customTooltip-show::after {
  top: initial;
  bottom: 102%;
  transform: rotate(180deg);
}

.overlayHidden {
  overflow: hidden;
}

.notifiDropdown {
  background: #ffffff 0% 0% no-repeat padding-box;
  box-shadow: 0px 6px 20px #00000029;
  border: 1px solid #dde5f3;
  border-radius: 10px;
  width: 700px;
  position: absolute;
  right: 0;
}

.notifiDropdownTop {
  padding: 30px 30px 40px 40px;
  display: flex;
}

.notifiDropdownTop h2 {
  font-size: 22px;
  font-weight: bold;
}

.notifiDropdownTop .right {
  flex: 1;
  display: flex;
  justify-content: flex-end;
}

.notifiDropdownTop .right .top_middle_search {
  width: 100%;
  max-width: 180px;
  margin-right: 10px;
}

.notifiDropdownTop .right .top_middle_search input {
  width: 100%;
  height: 35px;
}

.notifiDropdownTop .right .top_middle_search button {
  width: 44px;
  position: relative;
  right: 5px;
  top: -2px;
}

.notifiDropdownTop .right .top_middle_search button i {
  font-size: 18px;
  color: #1a1a1a;
}

.notifiDropdownTop .right .top_middle_filter {
  width: 35px;
  margin-right: 10px;
}

.notifiDropdownTop .right .top_dot_filter {
  width: 35px;
}

.notifiDropdownTop .right .top_dot_filter button {
  padding: 0;
  border-radius: 100%;
}

.notifiDropdownTop .right .top_dot_filter button:focus {
  background-color: #e1e8f4;
}

.notifiDropdownTop .right .top_dot_filter button:last-child {
  margin-right: 0px;
}

.notifiDropdownTop .right .top_dot_filter .dropdown-toggle::after {
  display: none;
}

.notifiDropdownTop .right .top_dot_filter .dropdown-menu .dropdown-item {
  width: initial;
  height: initial;
  font-size: initial;
  display: block;
  font-size: 12px;
  color: #092344;
  text-transform: initial;
  line-height: 20px;
}

.notifiDropdownTop .right .top_dot_filter .dropdown-menu .dropdown-item:hover {
  background-color: #e1e8f4;
}

.notifiDropdownTop .right .top_dot_filter .dropdown-menu {
  background: #ffffff 0% 0% no-repeat padding-box;
  box-shadow: 1px 6px 10px #00000029;
  border: 1px solid #e1e8f4;
  border-radius: 4px;
}

.notifiDropdownTab ul {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  padding: 0 40px;
  border: none !important;
}

.notifiDropdownTab ul li {
  width: initial;
  height: initial;
  border-radius: 0px;
  background-color: transparent;
  margin-left: 0;
  margin-right: 30px;
  border: none !important;
  margin-bottom: 0px !important;
}

.notifiDropdownTab ul li a {
  font-size: 14px;
  color: #6a7c9a;
  text-transform: initial;
  border-radius: 0px;
  border: none !important;
  padding: 0 0 8px !important;
}

.notifiDropdownTab ul li a.active {
  color: #186fd9 !important;
  border-bottom: 1px solid #186fd9 !important;
}

.notifiCol {
  border-bottom: 1px solid #dde5f3;
  border-top: 1px solid #dde5f3;
  padding: 25px 40px;
  display: flex;
}

.unreadNotifi {
  background-color: #f2f7ff;
  position: relative;
}

.notifiCol .left {
  flex: 1;
}

.notifiCol .left h3 {
  font-size: 14px;
  color: #1a1a1a;
  font-weight: bold;
  margin-bottom: 15px;
  max-width: 450px;
  position: relative;
}

.unreadNotifi .left h3::before {
  content: "";
  width: 6px;
  height: 6px;
  background-color: #186fd9;
  display: block;
  position: absolute;
  left: -14px;
  top: 6px;
  border-radius: 100%;
}

.notifiCol .left p {
  max-width: 450px;
  color: #1a1a1a;
  font-size: 14px;
  line-height: 20px;
  margin: 0;
}

.notifiCol .left p a {
  color: #186fd9;
  width: initial;
  height: initial;
  font-size: initial;
  display: initial;
  font-weight: 600;
}

.notifiCol .right {
  width: 100%;
  max-width: 120px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
}

.notifiCol .right .btnGroup {
  visibility: hidden;
  display: flex;
}

.notifiCol:hover .right .btnGroup {
  visibility: visible;
}

.notifiCol.flagactived .right .btnGroup {
  visibility: visible;
}

.notifiCol.flagactived .right .btnGroup .archiveBtn {
  visibility: hidden;
}

.notifiCol.flagactived .right .btnGroup .actionBtn {
  visibility: hidden;
}

.notifiCol.flagactived:hover .right .btnGroup .archiveBtn {
  visibility: visible;
}

.notifiCol.flagactived:hover .right .btnGroup .actionBtn {
  visibility: visible;
}

.notifiCol .right .btnGroup button {
  border: none;
  background-color: transparent;
  padding: 0;
  margin-right: 10px;
  box-shadow: none;
  outline: none;
  width: 30px;
  height: 30px;
  border-radius: 100%;
}

.notifiCol .right .btnGroup button:focus {
  background-color: #e1e8f4;
}

.notifiCol .right .btnGroup button:last-child {
  margin-right: 0px;
}

.notifiCol .right .btnGroup .dropdown button {
  margin-right: 0px;
  border-radius: 100%;
}

.notifiCol .right .btnGroup .dropdown-toggle::after {
  display: none;
}

.notifiCol .right .dropdown-menu .dropdown-item {
  width: initial;
  height: initial;
  font-size: initial;
  display: block;
  font-size: 12px;
  color: #092344;
  text-transform: initial;
  line-height: 20px;
}

.notifiCol .right .dropdown-menu .dropdown-item:hover {
  background-color: #e1e8f4;
}

.notifiCol .right .btnGroup .dropdown-menu {
  background: #ffffff 0% 0% no-repeat padding-box;
  box-shadow: 1px 6px 10px #00000029;
  border: 1px solid #e1e8f4;
  border-radius: 4px;
}

.notifiCol .right .btnGroup .flagactive .foractive {
  display: none;
}

.notifiCol .right .btnGroup .flagactive.active .forUnactive {
  display: none;
}

.notifiCol .right .btnGroup .flagactive.active .foractive {
  display: block;
  width: 48px;
}

.notifiCol .right p {
  color: #576b8d;
  font-size: 12px;
  font-weight: 500;
  margin: 0;
}

.dropdown-setting:hover {
  background-color: var(--e-global-before-light-border-color);
}

.dumpPointPopup {
  background-color: white;
  border-radius: 15%;
  font-size: 12px !important;
  width: 175px !important;
  min-width: 175px !important;
  padding: 20px !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

.dumpPointPopup > strong {
  display: inline-block;
  font-weight: bold;
  text-align: center;
  width: 100%;
}

.dumpEventPopup {
  background-color: white;
  border-radius: 15%;
  font-size: 12px !important;
  width: 175px !important;
  min-width: max-content !important;
  /* padding: 20px !important; */
  border-radius: 15px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

.dumpEventPopup > strong {
  display: inline-block;
  font-weight: bold;
  text-align: center;
  width: 100%;
}

.popup-tip-container-gray::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #e0e0e0;
  bottom: -1.3rem;
  left: 50%;
  transform: translateX(-50%);
}

.popup-tip-container::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #fff;
  bottom: -15px;
  left: 50%;
  transform: translateX(-50%);
}

.popup-tip-container_start_popup::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #fff;
  bottom: -12px;
  left: 50%;
  transform: translateX(-50%);
  /* border: 2px solid #92D5DB; */
}

.popup-tip-container_end_popup::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #fff;
  bottom: -13px;
  left: 50%;
  transform: translateX(-50%);
  /* border: 2px solid #92D5DB; */
}

.popup-tip-container_start_popup_border::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #92d5db;
  bottom: -15px;
  left: 50%;
  transform: translateX(-50%);
}

.popup-tip-container_end_popup_border::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #e39f9f;
  bottom: -17px;
  left: 50%;
  transform: translateX(-50%);
}

.popup-tip-container_park_popup_border::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #000;
  bottom: -13px;
  left: 50%;
  transform: translateX(-50%);
}

.hourly-result-excavator-card tbody td {
  font-weight: 600;
  padding: 5px 0 5px 10px;
}

.hourly-result-excavator-card tbody th {
  color: gray;
  font-weight: normal;
}

.no-wrap {
  white-space: nowrap;
}