body {
  position: relative;
  min-height: 100vh;
}

.react-select-error-mark {
  box-shadow: 0 0 0 0.25rem rgba(255, 0, 0, 0.25);

  border-radius: 3px;
}

.detail.title {
  color: #000;
}

/* Styles for Report Page */

.containerB {
  display: flex;

  justify-content: center;

  flex-direction: column;

  align-items: center;

  font-family: Lato-Regular;
}

.innerBox {

  border: 2px solid #ebe6f5;

  margin-top: 12px;

  padding: 10px 40px;

  border-radius: 8px;

  background-color: #ebe6f5;
}

.columnName {
  padding-bottom: 5px;
  font-weight: bold;
}

.boxContent {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-top: 15px;
  border: solid 1px;
  padding: 0px 8px;
  background-color: white;
  border-radius: 6px;
  overflow-x: auto;
}


.boxHeader {
  display: flex;

  justify-content: space-between;
}

.boxHeader .reportDate {
  font-size: 25px;
}

.projectSet {
  display: flex;

  justify-content: space-between;
}

.singleProjectInfo {
  margin-top: 10px;
}

.projectSet .ProjectName {
  width: 180px;

  margin-bottom: 5px;
}

.projectSet .hrs {
  width: 60px;

  margin-bottom: 5px;
}

.ProjectDescription {
  width: 200px;
}

.ProjectDescription:hover .tooltiptext {
  visibility: visible;
}

.tooltiptext {
  visibility: hidden;

  max-height: 200px;

  background-color: gray;

  color: #fff;

  border-radius: 6px;

  padding: 5px 0;

  position: absolute;
}

.truncate-text:hover .tooltiptext {
  display: block;
}


.tooltiptext {
  position: absolute;

  background-color: #f9f9f9;

  color: #333;

  padding: 8px;

  border: 1px solid #ccc;

  z-index: 1;

  width: auto;
  max-height: 500px;

  max-width: 350px;

  word-break: break-word;
}

/* Report page end */

.file-hover {
  font-weight: bold;

  margin-right: 6px;

  border-radius: 3px;

  padding: 0.99833em 0.99933em;

  background-color: rgb(249 249 249);

  font-size: 0.8rem;

  white-space: nowrap;

  margin: 8px 8px 8px 0px;

  cursor: pointer;
  /* display: flex; */
  z-index: 9;
}

.file-hover:hover~.file-hover,
.file-hover:hover {
  background-color: rgb(210, 210, 216);

  color: black;

  transition: 0.3s;
}

.sprint.active-status {
  border-radius: 4px;

  color: #fdfcfe !important;

  text-decoration: none;

  margin-right: 20px;

  background-color: #32aa00;

  padding: 4px 10px;

  font-family: Lato-Bold;
}

.sprint.inactive-status {
  border-radius: 4px;

  color: #fdfcfe !important;


  padding: 3px;

  padding-left: 17px;
}

.react-datepicker__input-container .react-datepicker__calendar-icon {
  padding: 0px !important;
}

.react-datepicker__calendar-icon {
  margin-left: 120px;

  margin-top: 12px;
}

.editor-height {
  /* 15/06/2024- Changes for https://edotpulse.com/EditActionItem/PULSE-558 */
  height: 230px !important;
}

.DraftEditor-editorContainer {
  z-index: 0 !important;
}

.react-datepicker__view-calendar-icon input {
  padding: 5px 0.75rem !important;
  width: 140px;
}

.react-datepicker-wrapper {
  width: 140px;
}

.timeSpent {
  width: 45px !important;

  padding: 2px !important;

  height: 30px !important;
}

.projectName-List {
  padding: 2px !important;

  height: 35px !important;
}

.css-1fdsijx-ValueContainer {
  padding: 0px !important;
}

.css-13cymwt-control {

  min-height: 0px !important;
}

.addeditreport-label {
  padding-top: 4px;
  margin-right: 12px;
}

.addeditreport {
  padding-top: 4px;
  text-align: center;
  padding-bottom: "10px";

  display: flex;
}



.sprint.completed-sprint {
  color: #483567;
  font-family: Lato-Bold;
  padding-top: 4px;
}

.sprint.active-status {
  border-radius: 4px;

  color: #fdfcfe !important;

  text-decoration: none;

  margin-right: 20px;

  background-color: #32aa00;

  padding: 4px 10px;

  font-family: Lato-Bold;
}

.sprint.inactive-status {
  border-radius: 4px;

  color: #fdfcfe !important;

  text-decoration: none;

  margin-right: 20px;


  padding: 4px 10px;

  font-family: Lato-Bold;
}

/* Login Page */

/* Font */

@font-face {
  font-family: Poppins-Regular;

  src: url("../fonts/poppins/Poppins-Regular.ttf");
}

/* @font-face {
  font-family: Poppins-Medium;

  src: url("../fonts/poppins/Poppins-Medium.ttf");
} */

@font-face {
  font-family: Poppins-Bold;

  src: url("../fonts/poppins/Poppins-Bold.ttf");
}

@font-face {
  font-family: Poppins-SemiBold;

  src: url("../fonts/poppins/Poppins-SemiBold.ttf");
}

/* Lato Font Styling */
@font-face {
  font-family: Lato-Bold;
  src: url("../fonts/Lato/Lato-Bold.ttf");
}

@font-face {
  font-family: Lato-Medium;
  src: url("../fonts/Lato/Lato-Medium.ttf");
}

@font-face {
  font-family: Lato-Regular;
  src: url("../fonts/Lato/Lato-Regular.ttf");
}



/* RESTYLE TAG */

* {
  margin: 0px;

  padding: 0px;

  box-sizing: border-box;
}

body,
html {
  min-height: 100vh;
  font-family: Lato-Regular, sans-serif;
}



input {
  outline: none;

  border: none;
}

button {
  outline: none !important;

  border: none;

  background: transparent;
}

button:hover {
  cursor: pointer;
}

.m-b-23 {
  margin-bottom: 23px;
}

.p-b-49 {
  padding-bottom: 49px;
}



.wrap-input100 {
  width: 100%;

  position: relative;

  border-bottom: 2px solid #d9d9d9;
}

.wrap-input1000 {
  width: 100%;

  position: relative;

  border-bottom: 2px solid #d9d9d9;

  padding-block: 13px;
}

.validate-input {
  position: relative;
}

.login100-form-title {
  display: block;

  font-family: Poppins-Bold;

  font-size: 34px;

  color: #333333;

  line-height: 1.2;

  text-align: center;
}

/* Form */

.login100-form {
  width: 100%;
}

.login100-form-title {
  display: block;

  font-family: Poppins-Bold;

  font-size: 34px;

  color: #333333;

  line-height: 1.2;

  text-align: center;
}

.login100-form-btn:hover {
  background-color: #34d8a0;
}

/* Input */

.wrap-input100 {
  width: 100%;

  position: relative;

  border-bottom: 2px solid #d9d9d9;
}

.label-input100 {
  font-family: Lato-Bold;

  font-size: 16px;

  color: #333333;

  line-height: 1.5;

  padding-left: 7px;
}

.input100 {
  font-family: Lato-Medium;

  font-size: 14px;

  color: #333333;

  line-height: 1.2;

  display: block;

  width: 100%;

  height: 55px;

  background: transparent;

  padding: 0 7px 0 43px !important;
}

/* -------- */

.focus-input100 {
  position: absolute;

  display: block;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  pointer-events: none;
}

.focus-input100::after {
  content: attr(data-symbol);

  font-family: Material-Design-Iconic-Font;

  color: #adadad;

  font-size: 22px;

  display: -webkit-box;

  display: -webkit-flex;

  display: -moz-box;

  display: -ms-flexbox;

  display: flex;

  align-items: center;

  justify-content: center;

  position: absolute;

  height: calc(100% - 20px);

  bottom: 0;

  left: 0;

  padding-left: 13px;

  padding-top: 3px;
}

.focus-input100::before {
  content: "";

  display: block;

  position: absolute;

  bottom: -2px;

  left: 0;

  width: 0;

  height: 2px;

  background: #7f7f7f;

  -webkit-transition: all 0.4s;

  -o-transition: all 0.4s;

  -moz-transition: all 0.4s;

  transition: all 0.4s;
}

.input100:focus+.focus-input100::before {
  width: 100%;
}

.has-val.input100+.focus-input100::before {
  width: 100%;
}

.input100:focus+.focus-input100::after {
  color: #cd353e;
}

.has-val.input100+.focus-input100::after {
  color: #cd353e;
}

/* -------- */

/* Login Button */

.container-login100-form-btn {
  display: -webkit-box;

  display: -webkit-flex;

  display: -moz-box;

  display: -ms-flexbox;

  display: flex;

  flex-wrap: wrap;

  justify-content: center;
}

.wrap-login100-form-btn {
  width: 100%;

  display: block;

  position: relative;

  z-index: 1;

  border-radius: 25px;

  overflow: hidden;

  margin: 0 auto;

  box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);

  -moz-box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);

  -webkit-box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);

  -o-box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);

  -ms-box-shadow: 0 5px 30px 0px rgba(3, 216, 222, 0.2);
}

.login100-form-bgbtn {
  position: absolute;

  z-index: -1;

  width: 300%;

  height: 100%;

  background: #34b88b;


  top: 0;

  left: -100%;

  -webkit-transition: all 0.4s;

  -o-transition: all 0.4s;

  -moz-transition: all 0.4s;

  transition: all 0.4s;
}

.login100-form-btn {
  font-family: Lato-Medium;

  font-size: 16px;

  color: #fff;

  line-height: 1.2;

  text-transform: uppercase;

  display: -webkit-box;

  display: -webkit-flex;

  display: -moz-box;

  display: -ms-flexbox;

  display: flex;

  justify-content: center;

  align-items: center;

  padding: 0 20px;

  width: 100%;

  height: 50px;
}

.wrap-login100-form-btn:hover .login100-form-bgbtn {
  left: 0;
}

.container-login100 {
  width: 100%;

  min-height: 100vh;

  display: -webkit-box;

  display: -webkit-flex;

  display: -moz-box;

  display: -ms-flexbox;

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  align-items: center;

  padding: 15px;

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;
}

.wrap-login100 {
  width: 420px !important;

  background: #fff;

  border-radius: 10px;

  overflow: hidden;

  box-shadow: 0px 0px 6px 2px #464646;

  box-shadow: 0px 0px 6px 2px rgb(70 70 70);
}

.wrap-login101 {
  width: 420px;


  border-radius: 10px;

  overflow: hidden;

  margin: 0 auto;
}

.modal-dialog.forgotpass {
  max-width: 420px;
  margin-top: 3.5em;
}

/* ST: 30/01/2025: Pulse-815 */
.custom-font-size.custom-font-size {
  font-size: 0.875rem;
}

/* end */

/* Responsive */

@media (max-width: 576px) {
  .wrap-login100 {
    padding-left: 15px;

    padding-right: 15px;
  }

  .modal-dialog.forgotpass {
    max-width: 420px;

    margin-top: 3.5em !important;

    margin: auto;
  }

  .login100-form-title {
    font-size: 24px;
  }
}

@media (max-width: 435px) {


  .modal-dialog.forgotpass {
    margin-left: 10px;

    margin-right: 10px;
  }
}

/*---------------------------------------------*/

.forgotPassword a {
  font-family: Lato-Regular;

  font-size: 14px;

  line-height: 1.7;

  color: #666666;

  margin: 0px;

  transition: all 0.4s;

  -webkit-transition: all 0.4s;

  -o-transition: all 0.4s;

  -moz-transition: all 0.4s;
}

.forgotPassword a:focus {
  outline: none !important;
}

.forgotPassword a:hover {
  text-decoration: none;

  color: #61efbc;
}



.footer-text {
  display: block;

  text-align: center;

  margin-top: 1.5em;

  margin-bottom: 0px;
}

.mainn {
  background: url("../images/login-background.png") top center;
  min-height: 100vh;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* MS */
.course-tab .toggle-col {
  align-self: center;
  padding-left: 0;
}

.toggle-col .toggle {
  position: relative;
  display: block;
  width: 80px;
  height: 35px;
  padding: 3px;
  margin: auto;
  border-radius: 50px;
}

.add-project .toggle-col .toggle {
  position: relative;
  display: block;
  width: 118px !important;
  height: 40px;
  padding: 3px;
  margin: auto;
  border-radius: 50px;
}

.toggle-col .toggle-input {
  position: absolute;
}

.toggle-col .toggle-label {
  position: relative;
  display: block;
  height: 35px;
  font-size: 12px;
  background: #808080;
  border-radius: inherit;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12),
    inset 0 0 3px rgba(0, 0, 0, 0.15);
}

.toggle-col .toggle-label:before,
.toggle-col .toggle-label:after {
  position: absolute;
  top: 50%;
  color: black;
  margin-top: -0.5em;
  line-height: 1;
}

.toggle-col .toggle-label:before {
  content: attr(data-off);
  right: 11px;
  color: #fff;
  text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}

.toggle-col .toggle-label.checked:after {
  content: attr(data-on);
  left: 16px;
  color: #fff;
  text-shadow: 0 1px rgba(0, 0, 0, 0.2);
  opacity: 0;
}

.toggle-col .toggle-label.checked {
  background: rgba(0, 128, 0);
}

.toggle-col .toggle-label.checked:before {
  opacity: 0;
}

.toggle-col .toggle-label.checked:after {
  opacity: 1;
}

.toggle-col .toggle-handle {
  position: absolute;
  top: 4px;
  left: 4px;
  width: 32px;
  height: 33px;
  background: linear-gradient(to bottom, #ffffff 40%, #f0f0f0);
  border-radius: 50%;
}

.toggle-col .toggle-handle:before {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -6px 0 0 -6px;
  width: 16px;
  height: 16px;
}

.toggle-col .toggle-handle.checked {
  left: 64px;
  box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

.add-project .toggle-col .toggle-handle.checked {
  left: 82px !important;
  box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

/* header activebutton css */
.active-page {
  font-family: Lato-Bold !important;
  /* font-size: 17px !important; SYJ - Commented this as this was Making the Desing of other menu break*/
  background-color: rgb(99, 99, 218);
  text-decoration: underline !important;
}

.custom-header-class {
  background-color: #f0f0f0;
  font-weight: bold;
  color: #333;
}

/* Time Bar style */

.timetracker:hover .timetrackertooltip {
  visibility: visible;
  z-index: 1;
}

.timetrackertooltip {
  visibility: hidden;

  max-height: 200px;

  background-color: gray;

  color: #fff;

  border-radius: 6px;

  padding: 5px 0;

  position: absolute;
  z-index: 0;
}

.error-input {
  text-align: left;
}

.error-input span {
  color: #e30808;
  font-size: 15px;
  font-weight: 400;
}

.breadcrumb-section {
  background-color: #f1f4f6;
  position: sticky;
  top: 0;
  z-index: 99;
}

ul.breadcrumb {
  padding: 6px 0 !important;
}

/* Display list items side by side */
ul.breadcrumb li {
  cursor: pointer;
}

/* Add a color to all links inside the list */
ul.breadcrumb li .select {
  cursor: context-menu;
}

/* Style for Breadcrumb */
ul.breadcrumb {
  padding: 22px 0 0 0;
  list-style: none;
  margin-bottom: auto;
}

/* Display list items side by side */
ul.breadcrumb li {
  display: inline;
  font-size: 16px;
}

/* Add a slash symbol (/) before/behind each list item */
ul.breadcrumb li+li:before {
  color: #56158b;
  content: "";
}

/* Add a color to all links inside the list */
ul.breadcrumb li .select {
  color: #2f188d;
  text-decoration: none;
  font-family: "Lato-Bold";
}

ul.breadcrumb li a {
  color: #56158b;
  text-decoration: none;
}

/* Add a color on mouse-over */
ul.breadcrumb li a:hover {
  color: #242145;
  text-decoration: underline;
}

.invalid-login-input {
  font-size: 13px;
  color: #e30808;
}

.invalid-message i {
  margin-left: calc(100% - 15px);
  color: #e30808;
}

.letterAvatar .dropdown-toggle::after {
  display: none !important;
}

.add-project-btn {
  border-radius: 5px;

  /* padding-block: 4px; */
  padding: 5px 8px;
  padding-inline: 10px;
  background: #483567;
  border: 2px solid #3d2557 !important;
  border-radius: 5px;
  padding-block: 6.7px;
  padding-inline: 10px;
  color: #fff;
  font-size: 14px;
  color: white;
  font-weight: 500 !important;
  font-family: Lato-Regular;
}

.add-project-btn-disable {
  cursor: not-allowed !important;
  border-radius: 5px;
  padding-block: 8px;
  padding-inline: 10px;
  border: none;
  background: #a68bc4;


  color: white;

  font-family: Lato-Bold;
}

/* Active Inactive Toggle */

.toggle-col {
  align-self: center;

  padding-left: 75px;

}

.toggle-col .toggle {
  position: relative;

  width: 100px;

  height: 40px;

  padding: 3px;

  margin: auto;

  border-radius: 50px;

  cursor: pointer;
}

.toggle-col .toggle-input {
  position: absolute;

  top: 0;

  left: 0;

  opacity: 0;
}

.toggle-col .toggle-label {
  position: relative;

  display: block;

  height: 35px;

  font-size: 12px;

  background: #808080;

  border-radius: inherit;

  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12),
    inset 0 0 3px rgba(0, 0, 0, 0.15);
}

.toggle-col .toggle-label:before,
.toggle-col .toggle-label:after {
  position: absolute;

  top: 50%;

  color: black;

  margin-top: -0.5em;

  line-height: 1;
}

.toggle-col .toggle-label:before {
  content: attr(data-off);

  right: 11px;

  color: #fff;

  text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}

.toggle-col .toggle-label:after {
  content: attr(data-on);

  left: 11px;

  color: #fff;

  text-shadow: 0 1px rgba(0, 0, 0, 0.2);

  opacity: 0;
}

.toggle-col .toggle-input:checked~.toggle-label {
  background: rgba(0, 128, 0);
}

.toggle-col .toggle-input:checked~.toggle-label:before {
  opacity: 0;
}

.toggle-col .toggle-input:checked~.toggle-label:after {
  opacity: 1;
}

.toggle-col .toggle-handle {
  position: absolute;

  top: 4px;

  left: 4px;

  width: 32px;

  height: 33px;

  background: linear-gradient(to bottom, #ffffff 40%, #f0f0f0);

  border-radius: 50%;
}

.toggle-col .toggle-handle:before {
  position: absolute;

  top: 50%;

  left: 50%;

  margin: -6px 0 0 -6px;

  width: 16px;

  height: 16px;
}

.toggle-col .toggle-input:checked~.toggle-handle {
  left: 64px;

  box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}


/* Active Inactive Toggle */

.toggle-col {
  align-self: center;
  padding-left: 75px;
}

.toggle-col .toggle {
  position: relative;


  width: 107px;

  height: 40px;

  padding: 3px;

  margin: auto;

  border-radius: 50px;

  cursor: pointer;
}

.toggle-col .toggle-input {
  position: absolute;

  top: 0;

  left: 0;

  opacity: 0;
}

.toggle-col .toggle-label {
  position: relative;

  display: block;

  height: 26px;
  width: 60px;

  font-size: 12px;

  background: #808080;

  border-radius: inherit;

  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12),
    inset 0 0 3px rgba(0, 0, 0, 0.15);
}

.toggle-col .toggle-label:before,
.toggle-col .toggle-label:after {
  position: absolute;

  top: 50%;

  color: black;

  margin-top: -0.5em;

  line-height: 1;
}

.toggle-col .toggle-label:before {
  content: attr(data-off);

  right: 7px;

  color: #fff;

  text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}

.toggle-col .toggle-label:after {
  content: attr(data-on);

  left: 11px;

  color: #fff;

  text-shadow: 0 1px rgba(0, 0, 0, 0.2);

  opacity: 0;
}

.toggle-col .toggle-input:checked~.toggle-label {
  background: rgba(0, 128, 0);
}

.toggle-col .toggle-input:checked~.toggle-label:before {
  opacity: 0;
}

.toggle-col .toggle-input:checked~.toggle-label:after {
  opacity: 1;
}

.toggle-col .toggle-handle {
  position: absolute;

  top: 4px;

  left: 4px;
  width: 25px;
  height: 24px;

  background: linear-gradient(to bottom, #ffffff 40%, #f0f0f0);

  border-radius: 50%;
}

.toggle-col .toggle-handle:before {
  position: absolute;

  top: 50%;

  left: 50%;

  margin: -6px 0 0 -6px;

  width: 16px;

  height: 16px;
}

.toggle-col .toggle-input:checked~.toggle-handle {
  left: 37px;

  box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

/* Transition*/

.toggle-col .toggle-label,
.toggle-col .toggle-handle {
  transition: All 0.3s ease;

  -webkit-transition: All 0.3s ease;

  -moz-transition: All 0.3s ease;

  -o-transition: All 0.3s ease;
}

/* End of Active Inactive Toggle */

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

/* Loader */
/* SYJ Changes to fix Loader issue */
.loader-body {
  height: 100%;
  width: 100%;
  display: flex;
  position: fixed;
  justify-content: center;
  align-items: center;
  background-color: #00000054;
  z-index: 9999;
}

.loader-parent {
  text-align: center;
  justify-content: center;
  align-items: center;
}

.loader {
  width: 50px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #514b82;
  box-shadow: 0 0 0 0 #0004;
  animation: l1 1s infinite;
}

@keyframes l1 {
  100% {
    box-shadow: 0 0 0 30px #0000
  }
}

/* Loader End */

.log-cancel-div {
  padding: 24px 0 10px;
  text-align-last: end;
  font-family: "Lato-Medium";
}

.log-btn {
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: 2px solid #3d2557;
  padding: 4px 10px;
}

.columnName {
  font-weight: bold;
}

.task-columns {
  display: flex;
  overflow-x: scroll;
  min-height: calc(100vh - 285px);
}

@media screen and (max-width: 1439px) {
  .task-columns {
    min-height: calc(100vh - 194px);
  }

}


.card-body.item-card {
  min-width: 170px;
}

.card.card-border-primary.column-title-name {
  border-bottom: 10px solid white;

}

.sprint-specification-complete {
  justify-content: space-between;
  display: flex;
  flex-wrap: wrap;
}

.sprint-category-column {
  width: 100%;
  margin: 10px;
}

.sprint-title {
  padding: 8px;
}

.sprint-date-completion {
  padding: 8px;
}

.sprint-time-remaining {
  display: flex;
  justify-content: column;
  padding: 0px 10px 0 0;
  font-family: 'Lato-Bold';
  color: #483567;
  align-items: end;

}

.sprint-time-remaining-minus {
  padding: 0px 10px;
  font-family: 'Lato-Bold';
  color: #e30808;
}

.sprint-time-remaining-plus {
  padding: 0px 10px 0 0;
  font-family: 'Lato-Bold';
  color: #483567;
}

.card.card-border-primary.column-title-name {
  background-color: rgb(255, 207, 175);
  text-align: center;
  padding-block: 15px;
  font-family: Lato-Bold !important;
  font-size: 18px;
}

/* For active page */


.swimLaneContainer {
  display: flex;
  justify-content: left;
  padding-left: 124px;
}

.showNewInputField {
  padding-top: 3px;
  text-decoration: underline;
  color: blue;
}

.addNewSwimlane {
  margin: 5px;
  border-radius: 5px;
  padding-inline: 10px;
  border: none;
  background: #684e85;
  color: white;
  font-family: Lato-Bold;
}

/* Custom CSS for Ag-Grid */

.header {
  background-color: #684e85;
  color: white;
  font-family: Lato-Medium;
}


.ag-header-cell-text {
  font-size: medium;
}

.tableCell {
  font-family: Lato-Regular;
  color: inherit;
  background-color: #ffffff;

}

.ag-header:hover {
  background-color: #684e85;
  color: white;
}

.boxConten {

  display: flex;
  flex-direction: column;

  align-items: flex-start;

  padding: 0px 8px;
  background-color: white;
}

.add-project .boxContenn {
  overflow-x: auto;
  padding: 0;
  background-color: #fff;
}

.add-project .boxContenn td,
.add-project .boxContenn th {
  padding: 10px 18px;
}


/* delete-modal */
.delete-modal-main {
  text-align: center;
  margin-top: 10;
}


.sprint-list {
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  margin-left: 35px;
  width: 260px;
  word-break: break-all;
  justify-content: space-between;
}

.sprint-list li {
  margin: 3px;
  text-align: left;
  padding-inline: 10px;
  flex: 0 0 calc(50% - 10px);
  box-sizing: border-box;
}

.p-inputtext {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 0rem;
  color: #495057;
  padding: 0.75rem 0.75rem;
  border: 2px solid #505050 !important;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s !important;
  appearance: none;
  border-radius: 6px !important;
}

.ag-header-container {
  background-color: #684e85;
}

/* ProjectTablePagination.jsx */
.pagination-container {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-top: 10px;
}

.pagination-button {
  background-color: #684e85;
  color: #fff;
  border: none;
  padding: 5px 10px;
  margin: 0 5px;
  cursor: pointer;
  border-radius: 3px;
}

.pagination-button:disabled {
  background-color: #ccc;
  cursor: not-allowed;
}

/* SYJ- Manage User left Color icon Style */
.ag-cell.ag-cell-last-left-pinned:not(.ag-cell-range-right):not(.ag-cell-range-single-cell) {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* remove ag grid column border on select */
.ag-ltr .ag-cell-focus:not(.ag-cell-range-selected):focus-within,
.ag-ltr .ag-cell-range-single-cell,
.ag-ltr .ag-cell-range-single-cell.ag-cell-range-handle,
.ag-ltr .ag-context-menu-open .ag-cell-focus:not(.ag-cell-range-selected),
.ag-ltr .ag-full-width-row.ag-row-focus:focus .ag-cell-wrapper.ag-row-group,
.ag-rtl .ag-cell-focus:not(.ag-cell-range-selected):focus-within,
.ag-rtl .ag-cell-range-single-cell,
.ag-rtl .ag-cell-range-single-cell.ag-cell-range-handle,
.ag-rtl .ag-context-menu-open .ag-cell-focus:not(.ag-cell-range-selected),
.ag-rtl .ag-full-width-row.ag-row-focus:focus .ag-cell-wrapper.ag-row-group {
  border: #00000000 !important;
  outline: unset !important;
}

.isRequiredField {
  color: #e30808;
}

.admin-footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  background-color: #CAC0DC;
  color: #483567;
  text-align: center;
  font-weight: bold;
  font-size: large;
  padding: 12px 0px;
}

.admin-footer p {
  margin-bottom: 0 !important;
}


/* SYJ Delete Modal CSS */
.deletedoc .modal-body {
  padding: 20px !important;
}

.deletedoc .block1 {
  font-family: Lato-Regular !important;
  font-size: 18px !important;
  text-align: center !important;
  font-weight: 500;
}

.deletedoc .box {
  border: 3px solid #483567 !important;
  border-radius: 15px !important;
}

.deletedoc .yes-btn {
  margin-right: 8px !important;
}

.deletedoc .mail-link {
  padding: 10px !important
}

.deletedoc .Ok-btn {
  padding: 4px 30px !important;
  margin-bottom: 2em !important;
  background-color: #483567 !important;
  color: white !important;
  text-align: center !important;
  font-family: OpenSans-Regular !important;
}

.deletedoc .modal-dialog {
  max-width: 400px !important;
}

.deletedoc .yes-btn {
  padding: 4px 10px !important;
  margin-top: 10px !important;
  background-color: #483567 !important;
  color: white !important;
  text-align: center !important;
  font-family: Lato-Regular !important;
  border: 1px solid #483567 !important;
}

.deletedoc .yes-btn:focus {
  box-shadow: none !important;
}

.deletedoc .yes-no-btn {
  margin-top: 8px !important;
  display: flex !important;
  justify-content: center !important;
}

.deletedoc .no-btn {
  padding: 4px 10px !important;
  margin-top: 10px !important;
  background-color: #fcfdfe !important;
  color: #483567 !important;
  text-align: center !important;
  border: 1px solid #483567 !important;
  font-family: Lato-Regular !important;
}

.deletedoc .no-btn:focus {
  box-shadow: none !important;
}

.time-log-btn {
  border-radius: 5px;
  padding-block: 8px;
  padding-inline: 10px;
  border: 2px solid #3d2557 !important;
  background: #684e85;
  color: white;
  font-family: Lato-Bold;
}

/* SYJ - AG Grid Styles  */
.ag-theme-alpine {
  --ag-selected-row-background-color: rgba(188, 188, 188, 1);
  font-size: 14px !important;
  font-family: "Lato-Regular" !important;
}

.ag-input-field-input:hover {
  cursor: pointer !important;
}

.ag-header-viewport {
  background-color: #684e85;
  font-size: "8px";
}

.ag-pinned-right-header {
  background-color: #c4daf5;
}

.ag-row-hover {
  background-color: #e0e0e0 !important;
  cursor: pointer;
}

.ag-header-cell-text {
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 14px !important;
  font-family: Lato-Bold;
  color: #ffffff;
}



/* SYJ Accordian Changes */
.accordian-devstyle {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0.7rem 1.25rem;
  font-size: 1rem;
  color: #212529;
  text-align: left;
  background-color: #fff;
  border: 0;
  border-radius: 0;
  padding-left: 0px;
  overflow-anchor: none;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
}

.accordian-devstyle:not(.collapsed) {
  color: #0c63e4;
  background-color: #ebe6f5;
}

.display-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #000;
  z-index: 99;
  opacity: 0.2;
}

/* .drag-drop:hover {
  background-color: #8975a02b;
} */

.bg-hover:hover {
  background-color: #ccc3db !important;
}

.progress-bar-container {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.progress-bar {
  width: 100%;
  height: 20px;
  background-color: #ccc;
  border-radius: 10px;
  overflow: hidden;
}

.progress-bar-fill {
  height: 100%;
  transition: width 0.5s ease-in-out;
}

.progress-bar-fill.positive {
  background-color: #4caf50;
}

.progress-bar-fill.negative {
  background-color: #f44336;
}

.progress-bar-text {
  margin-left: 10px;
  font-size: 14px;
  color: #333;
}

.cardItem {
  width: 19px !important
}

p,
th,
td,
input,
div {
  font-family: 'Lato-Regular' !important;
  font-size: 14px;
}

label {
  font-family: 'Lato-Bold';
  font-size: 14px;
}

a,
button {
  font-family: 'Lato-Regular';
  font-weight: bold;
}

.create-issue .file-attachment-btn .upload-img {
  margin-bottom: 3px;
}

.form-check-label {
  font-family: 'Lato-Regular' !important;
}



/* SJY - Changes for Assigning Employee Modal - https://jiraapp.edotteam.com/browse/PU-230*/

.capsule-side-vertical-scroller {
  /* max-height: 150px; */
  max-height: 250px;
  overflow-y: auto;
}

@media screen and (max-width: 600px) {
  .modal-dialog-custom {
    max-width: 100% !important;
  }
}

/* <summary>
date: 13-02-2024
Name: MS
description: pagination
<summary>*/
.pagination {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 20px 0;
  justify-content: center;
}

.pagination__item {
  margin: 0 10px;
}

.pagination__link,
.pagination__number,
.pagination__previous,
.pagination__next {
  display: inline-block;
  padding: 8px 12px;
  border: 1px solid #ccc;
  background-color: #fff;
  color: #333;
  cursor: pointer;
  text-align: center;
}

.pagination li {
  margin: 10px;
  /* Adjust spacing between page numbers */
  text-align: center;
}

.pagination__link--active,
.pagination__number--active,
.pagination__previous--active,
.pagination__next--active {
  background-color: #007bff;
  color: #fff;
  display: inline-block;
  padding: 8px 12px;
}

.pagination__link--disabled,
.pagination__previous--disabled,
.pagination__next--disabled {
  pointer-events: none;
  opacity: 0.5;
}

/* CSS for the all-issues quick filter when active */
.quickfilter.active button {
  background-color: white;
  border: 2px solid #7d6b9a !important;
  border-radius: 4px;
  color: #483567;
  border: none;
  display: flex;
  height: 32px;
}

.issue-details span {
  text-wrap: wrap !important;
}

@media screen and (max-width: 767px) {
  .addeditreport-responsive {
    flex-direction: column;
  }

  .addeditreport .margin-leftt {
    margin-left: 0 !important;
  }
}

@media screen and (max-width: 991px) {
  .sprint-label {
    margin-left: 0 !important;
  }

  .assign-to-fdirection {
    flex-direction: column;
  }

  .issue-details .label-div {
    width: 97px !important;
  }
}

.task-link {
  text-wrap: nowrap !important;
}

@media screen and (max-width: 450px) {

  .card-wrap-responsive {
    flex-wrap: wrap;
  }
}

.overview-task-name-spacing {
  padding-inline: 8px;
}

.overview-priority-spacing {
  padding-inline: 6px;
}

.modal-dialog-employee-custom {
  max-width: 675px !important;
}

.color-sec input {
  height: 37.66px;
  padding-inline: 0px;
}


/* SYJ- Custome Toggle for Release/Unrelease Toggle */

.course-tab .toggle-col {
  align-self: center;
  padding-left: 0;
}

.toggle-col .toggle {
  position: relative;
  display: block;
  width: 80px;
  height: 30px;
  padding: 3px;
  margin: auto;
  border-radius: 50px;
}

.add-project .toggle-col .toggle {
  position: relative;
  display: block;
  width: 118px !important;
  height: 40px;
  padding: 3px;
  margin: auto;
  border-radius: 50px;
}

.toggle-col .toggle-input {
  position: absolute;
}

.toggle-col .toggle-release-label {
  position: relative;
  display: block;
  height: 35px;
  font-size: 12px;
  background: #808080;
  border-radius: inherit;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12),
    inset 0 0 3px rgba(0, 0, 0, 0.15);
}

.toggle-col .toggle-release-label:before,
.toggle-col .toggle-label:after {
  position: absolute;
  top: 50%;
  color: black;
  margin-top: -0.5em;
  line-height: 1;
}

.toggle-col .toggle-release-label:before {
  content: attr(data-off);
  right: 12px;
  color: #fff;
  text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}

.toggle-col .toggle-release-label.checked:after {
  content: attr(data-on);
  position: absolute;
  left: 22px;
  top: 8px;
  color: #fff;
  text-shadow: 0 1px rgba(0, 0, 0, 0.2);
  opacity: 0;
}

.toggle-col .toggle-release-label.checked {
  background: rgba(0, 128, 0);
}

.toggle-col .toggle-release-label.checked:before {
  opacity: 0;
}

.toggle-col .toggle-release-label.checked:after {
  opacity: 1;
}

.toggle-col .toggle-release-handle {
  position: absolute;
  top: 4px;
  left: 4px;
  width: 32px;
  height: 33px;
  background: linear-gradient(to bottom, #ffffff 40%, #f0f0f0);
  border-radius: 50%;
}

.toggle-col .toggle-release-handle:before {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -6px 0 0 -6px;
  width: 16px;
  height: 16px;
}

.toggle-col .toggle-release-handle.checked {
  left: 64px;
  box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

.add-project .toggle-col .toggle-release-handle.checked {
  left: 82px !important;
  box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

/* SYJ agrid Custome HEader Style */
.ag-header-cell-resize {
  position: absolute !important;
  z-index: 2 !important;
  height: 100% !important;
  width: 0px !important;
  top: 0 !important;
  cursor: ew-resize !important;
}

/* .sprintOverview-quickfilter button {
  background-color: #b5a5c4!important;
  border: 2px solid #483567!important;
  padding: 6px;
  border-radius: 4px;
  color: #483567;
  border: none;
  font-family: Lato-Bold ;
} */

.sprintOverview-quickfilter.active button {
  background-color: white;
  border: 2px solid #483567 !important;
  color: #483567;
  border: none;
  display: flex;
  height: 32px
}

.disabled-div {
  border: 1px solid #ccc;
  /* Border style */
  width: 180px;
  padding: 6px;
  /* Padding for content */
  border-radius: 4px;
  word-wrap: break-word;
  color: #888;
  /* Text color */
  background-color: #f8f8f8;
  /* Background color */
  pointer-events: none;
  /* Disable pointer events */
  opacity: 1;
  /* Adjust opacity to visually indicate disabled state */
}

@media screen and (max-width: 767px) {
  .modal-dialog-employee-custom {
    max-width: 500px !important;
  }

  .modal-bubble-wrap {
    flex-wrap: wrap;
  }
}

.qfliter {
  display: flex;
  flex-wrap: wrap;
}

@media screen and (max-width: 1128px) {
  .dropFlex {
    padding-bottom: 10px;
  }
}

@media screen and (min-width: 768px) {
  .col-custom {
    padding-left: 27px !important;
    padding-right: 0 !important;
  }

  .or-text {
    position: absolute;
    right: -11px;
    top: 39px;
  }
}

@media screen and (max-width: 767px) {
  .or-text {
    display: block;
    margin-top: 15px !important;
    text-align: center;
  }
}


.ag-theme-alpine .ag-row {
  font-size: 14px !important;
  --ag-line-height: 35px !important;
  font-family: Lato-Regular !important;
}


.option-with-margin-left {
  margin-left: 20px;
}

/*SYJ - 26/03/2024- Remove RightPinned Items from AG gird BottomPinned */
.ag-pinned-right-floating-bottom {
  display: none !important;
}

.file-hover {
  position: relative;
}

.image-preview {
  position: absolute;
  top: 10px !important;
  z-index: 999;
  display: block;
}

.file-hover:hover .image-preview {
  display: block;
}

.image-preview img {
  margin-top: 50px;
  width: 300px;
  height: 300px;
  object-fit: contain;
}

/* SYJ Handle AG-Grid Right Pinned HEader Style */
.ag-header :hover {
  background-color: #684e85 !important;
}

.ag-pinned-right-header {
  background-color: #684e85 !important;
}

/* On scroll */
.scroll-button-container {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 1000;
  /* Adjust the z-index as needed */
}

.scroll-button {
  cursor: pointer;
  background-color: #fff;
  border: 1px solid #483567;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 10px;
}

.scroll-button:hover {
  background-color: #f0f0f0;
}

/* Profile */
.user-profile-body {
  padding-bottom: 3rem;
}

.user-profile label {
  font-size: 14px;
  /* color: #4E4E4E; */
  color: #080000;

}

.user-profile .user-profile-img-sec {
  text-align: -webkit-center;
}

.user-profile label {
  font-family: Lato-Bold;
  font-size: 15px;
}

.user-profile .user-profile-img-sec .user-profile-img {
  height: 130px;
  width: 130px;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.user-profile .user-profile-img-sec .user-profile-img span {
  font-size: 35px;
  font-family: Lato-Bold;
  color: #fff;
}

.ct-profile-fbox {
  display: flex;
  justify-content: center;
}

.user-profile .login-role-fbox {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.user-profile .login-role-fbox .login-role-label {
  font-size: 12px;
  font-family: Lato-Bold;
  color: #4E4E4E;
}

.user-profile .login-role-fbox .login-role-value {
  font-size: 12px;
  font-family: Lato-Medium;
  color: #4E4E4E;
}

.mandatory-field {
  color: #e30808;
}

.mandatory-fields {
  color: #e30808;
  margin-left: 4px;
}

.error-message {
  color: #e30808 !important;
}

.user-profile .change-password-sec {
  margin-top: 16px;
  background-color: #FFFFFF;
  border: 1px solid #CBCBCB;
  box-shadow: 0px 3px 6px #00000029;
  padding: 0 12px 8px;
  border-radius: 6px;
}

.user-profile .change-password-label {
  text-align: left;
}

.change-password-sec .field-icon {
  float: right;
  /* margin-left: -25px; */
  right: 6px;
  margin-top: -26px;
  position: relative;
  z-index: 2;
}

.change-password-sec .change-password-btn-sec {
  text-align: right;
}

.change-password-sec .change-password-btn {
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: none;
  padding: 4px 10px;
}

.change-password-sec label {
  font-size: 13px !important;
}

.change-password-toggle {
  text-align: right;

}

.toggle-password-btn {
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: none;
  padding: 4px 10px;
  margin-top: 5px;
}

.custom-input {
  padding-block: 2px;
  font-size: 15px;
  line-height: 1 !important;
}


.bubble-sec .close-bubble {
  color: #483567;
  font-size: 16px;
  margin-left: 6px;
}

.user-profile .leaves-sec {
  background-color: #FFFFFF;
  border: 1px solid transparent;
  box-shadow: 0px 3px 6px #00000029;
  padding: 0 12px;
  border-radius: 3px;
}

.leaves-sec {
  max-height: 36vh;
  overflow-y: auto;
}

@media screen and (max-height: 768px) {
  .leaves-sec {
    max-height: 140px;
  }
}

.leaves-sec .leaves-main {
  margin-block: 12px;
}

.leaves-sec .leave-period {
  font-size: 14px;
  font-family: Lato-Medium;
  color: #363636;
  margin-bottom: 0;
}

.leaves-sec .leave-reason {
  font-size: 11px;
  font-family: Lato-regular;
  color: #808080;
  margin-bottom: 0;
}

.user-profile .save-cancel-sec {
  /* padding: 24px 0 10px;
  text-align-last: center; */
  font-family: "Lato-Medium";
  text-align: right !important;
  margin-top: 15px;
  /* padding: 24px 0 10px; */
}



.user-profile .save-btn {
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: 1px solid #483567;
  padding: 4px 10px;
  margin-right: 5px;
}

.user-profile .cancel-btn {
  border: 1px solid #483567;
  color: #483567;
  background-color: #fff;
  border-radius: 5px;
  /* border: none; */
  padding: 4px 10px;
}

.add-time-log .save-cancel-btn {
  text-align: center !important;
  padding: 24px 0 10px;
}

.add-time-log .save-cancel-btn .save-btn {
  margin-right: 4px;
  /* font-family: Lato-Medium; */
  /* font-size: 15px; */
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: 1px solid #3d2557 !important;
  padding: 4px 10px;
}

.user-profile .disabled-custom-input:focus-visible {
  outline: none;
  box-shadow: none;
}

.user-profile .disabled-custom-input:focus {
  border: 1px solid #ced4da;
}

@media screen and (max-width: 991px) {

  /* User Profile  */
  .flex-switch {
    flex-direction: column-reverse;
  }
}

/* -- profile hover animation  --- */
.ct-profile-sec .image-wrap {
  z-index: 1;
  display: block;
  margin: 0 auto;
  margin-bottom: 0.5em;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  overflow: hidden;
  width: auto;
  line-height: 0;
}

.ct-profile-sec .image-wrap {
  /* border: 4px solid white; */
  -moz-box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.2);
  box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.2);
  display: inline-block;
}

.ct-profile-sec .image-wrap {
  background: #000000;
  width: 130px;
  height: 130px;
  display: flex;
}

.ct-profile-sec .image-wrap img {
  width: 100%;
  height: auto;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  vertical-align: middle;
  object-fit: contain;
  /* background-color: #fff; */
}

.ct-profile-sec .image-wrap img {
  opacity: 1;
  -moz-transition-property: opacity;
  -o-transition-property: opacity;
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

.ct-profile-sec {
  list-style: none;
  float: left;
  /* margin-right: 4%; */
  position: relative;
  overflow: hidden;
  text-align: center;
}

.ct-profile-sec:hover .edit-profile {
  left: 0;
  margin-left: 0;
}

.ct-profile-sec:hover .edit-profile i,
.ct-profile-sec:hover .delete-profile i {
  font-size: 25px;
}

.ct-profile-sec:hover .user-profile-img {
  opacity: 0.5;
}

.ct-profile-sec:hover .delete-profile {
  left: 0;
  margin-right: 0;
}

.ct-profile-sec:hover img {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}

.ct-profile-sec .info {
  text-align: center;
  font-size: 0.75em;
  color: white;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 33%;
  display: flex;
  justify-content: space-evenly;
}

.ct-profile-sec .edit-profile {
  font-weight: bold;
  display: block;
  -moz-transition-property: all;
  -o-transition-property: all;
  -webkit-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.6s;
  -o-transition-duration: 0.6s;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  margin-left: -200%;
  font-size: 28px;
}

.ct-profile-sec .delete-profile {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  display: block;
  -moz-transition-property: all;
  -o-transition-property: all;
  -webkit-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.6s;
  -o-transition-duration: 0.6s;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  margin-right: -200%;
  font-size: 28px;
}

.ct-profile-sec .edit-profile a {
  color: #fff;
}

.ct-profile-sec .delete-profile a {
  color: #fff;
}

.ct-profile-sec:hover .div-line {
  width: 2px;
  height: 80px;
  margin-top: -16px;
  color: #fff;
  /* background-color: #fff; */
}

.custom-colorpicker .p-inputtext {
  padding: 8px !important;
  width: 100%;
}

.custom-colorpicker div {
  display: block !important;
  margin-top: -4px;
}

/* -- profile hover animation End  --- */

/* Profile End */







/* Add Employee */

.add-employee-body {
  padding-bottom: 3rem;
}

.add-employee label {
  font-family: Lato-Bold;
  font-size: 15px;
  /* color: #4E4E4E; */
  color: #0a0a0a;
}

.add-employee .phoneerror {
  color: #e30808;
}

.user-profile-img-sec .user-profile-img {
  height: 130px;
  width: 130px;
  border-radius: 100%;

  display: flex;
  justify-content: center;
  align-items: center;
}

.user-profile-img-sec .user-profile-img span {
  font-size: 35px;
  font-family: Lato-Bold;
  color: #fff;
}

.custom-input {
  /* padding-block: 2px !important; */
  font-size: 15px !important;
  line-height: 1.2 !important;
}

.bubble-sec {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin-top: 19px;
}

.bubble-sec .bubble-display {
  background-color: #DDD4EB;
  border: 1px solid #483567;
  padding: 2px 6px;
  font-size: 13px;
  margin-right: 8px;
  border-radius: 24px;
  display: inline-block;
  margin-top: 6px;
}

.bubble-sec .close-bubble {
  color: #483567;
  font-size: 16px;
  margin-left: 6px;
}

.add-employee .save-cancel-sec {
  padding: 24px 0 10px;
  text-align-last: end;
  font-family: Lato-Medium;
}

.add-employee .save-btn {
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: 1px solid #483567;
  padding: 5px 8px;
  margin-right: 4px;
}

.add-employee .cancel-btn {
  border: 1px solid #483567;
  color: #483567;
  background-color: #fff;
  border-radius: 5px;
  /* border: none; */
  padding: 5px 8px;
}

/* -- profile hover animation  --- */
.ct-profile-fbox {
  display: flex;
  justify-content: center;
}

.ct-profile-sec .image-wrap {
  z-index: 1;
  display: block;
  margin: 0 auto;
  margin-bottom: 0.5em;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  overflow: hidden;
  width: auto;
  line-height: 0;
}

.ct-profile-sec .image-wrap {
  /* border: 4px solid white; */
  -moz-box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.2);
  box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.2);
  display: inline-block;
}

.ct-profile-sec .image-wrap {
  background: #000000;
  width: 130px;
  height: 130px;
  display: flex;
}

.ct-profile-sec .image-wrap img {
  width: 100%;
  height: auto;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  vertical-align: middle;
  object-fit: contain;
  /* background-color: #fff; */
}

.ct-profile-sec .image-wrap img {
  opacity: 1;
  -moz-transition-property: opacity;
  -o-transition-property: opacity;
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

.ct-profile-sec {
  list-style: none;
  float: left;
  /* margin-right: 4%; */
  position: relative;
  overflow: hidden;
  text-align: center;
  width: 140px;
}

.ct-profile-sec:hover .edit-profile {
  left: 0;
  margin-left: 0;
}

.ct-profile-sec:hover .edit-profile i,
.ct-profile-sec:hover .delete-profile i {
  font-size: 25px;
}

.ct-profile-sec:hover .user-profile-img {
  opacity: 0.5;
}

.ct-profile-sec:hover .delete-profile {
  left: 0;
  margin-right: 0;
}

.ct-profile-sec:hover img {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}

.ct-profile-sec .info {
  text-align: center;
  font-size: 0.75em;
  color: white;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 33%;
  display: flex;
  justify-content: space-evenly;
}

.ct-profile-sec .edit-profile {
  font-weight: bold;
  display: block;
  -moz-transition-property: all;
  -o-transition-property: all;
  -webkit-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.6s;
  -o-transition-duration: 0.6s;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  margin-left: -200%;
  font-size: 28px;
}

.ct-profile-sec .delete-profile {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  display: block;
  -moz-transition-property: all;
  -o-transition-property: all;
  -webkit-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.6s;
  -o-transition-duration: 0.6s;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  margin-right: -200%;
  font-size: 28px;
}

.ct-profile-sec .edit-profile a {
  color: #fff;
}

.ct-profile-sec .delete-profile a {
  color: #fff;
}

.ct-profile-sec:hover .div-line {
  width: 2px;
  height: 80px;
  margin-top: -16px;
  color: #fff;
  /* background-color: #fff; */
}


.add-employee .text-muted {
  font-size: 15px;
}

/* -- profile hover animation End  --- */

/* Add Employee End */

.task-hover:hover {
  background-color: #8975a02b;
}

.sticky-header {
  position: sticky !important;
  top: 0;
  z-index: 1000;
  /* Ensure it appears above other content */
  background-color: white;
  /* Set background color as needed */
  padding: 10px;
  /* Add padding for better appearance */
}

/* My Tasks */
.my-tasks {
  /* padding-top: 1rem; */
  padding-bottom: 3rem;
}

.my-tasks .collapsible-sec-pos {
  position: relative;
  background-color: #EBE6F5;
  padding: 5px 8px 5px;
  border-radius: 5px;
  box-shadow: 0 3px 6px #00000029;
}

.my-tasks .collapsible-sec-header {
  padding-left: 25px;
  background-color: #EBE6F5;
  padding-right: 8px;
  /* padding-block: 4px; */

}

.my-tasks .collapsible-sec-pos .collapsible-btn {
  border: none;
  border-radius: 3px;
  padding: 0 5px 0 4px;
  position: absolute;
  top: 10px;
  color: #fff;
  background-color: #483567;
  left: 9px;
  font-size: 10px;
}

.my-tasks .collapsible-sec-pos .active i {
  transform: rotate(90deg);
}

.my-tasks .collapsible-sec-pos .collapsible-header-text {
  font-size: 18px;
  font-family: Lato-Bold;
  color: #4E4E4E;
}


.my-tasks .collapsible-sec-pos .contentt {
  display: none;
}

.my-tasks .custom-grid-sec td {
  background-color: #ffffff;
  /* text-align: left; */
  padding: 5px;
  border-bottom: 3px solid #EBE6F5;
  font-family: Lato-Medium;
}

.my-tasks .search-add-fbox {
  display: flex;
  justify-content: space-between;
}

.pending-status {
  background-color: #85784E;
  color: #fff;
  font-size: 14px;
  padding: 2px 8px;
  border-radius: 3px;
}

.completed-status {
  background-color: #11A500;
  color: #fff;
  font-size: 14px;
  padding: 2px 8px;
  border-radius: 3px;
}

.my-tasks .task-id {
  color: #0011FF;
  text-decoration: underline;
}

.my-tasks .searchBar {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  background-color: #f5f5f5;
}

.my-tasks #searchQueryInput {
  width: 100%;
  height: 38px;
  outline: none;
  border: 1px solid rgb(72, 53, 103);
  border-radius: 5px;
  padding: 6px 10px;
  font-size: 13px;
}

.my-tasks #searchQuerySubmit {
  width: 2.5rem;
  height: 1.8rem;
  margin-left: -3.2rem;
  background: #ffffff;
  border: none;
  outline: none;
}

.my-tasks .add-task-sec {
  text-align: end;
}

.my-tasks .add-task-btn {
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: none;
  padding: 4px 10px;
}

/* Media Query */
@media screen and (min-width: 992px) {
  #manage-user .nav-margin {
    margin-right: 45px;
  }
}

@media screen and (min-width: 992px) and (max-width: 1199px) {
  .date-range-fbox span {
    font-family: Lato-Bold;
    font-size: 14px;
  }

  .date-range-fbox img {
    width: 16px;
  }
}

@media screen and (max-width: 767px) {
  .time-log .date-range-fbox {
    justify-content: space-around;
  }

  /* Add Employee  */
  .bubble-sec {
    margin-top: -8px;
  }
}

@media screen and (max-width: 991px) {

  /* Add Employee  */
  .flex-switch {
    display: flex;
    flex-direction: column-reverse;
  }
}

@media screen and (max-width: 576px) {

  /* Roles & Permissions  */
  .roles-permissions .save-cancel-sec {
    width: 50%;
    text-align: end;
  }

  .roles-permissions .section-title h6 {
    font-size: 15px;
  }

  .roles-permissions .save-btn,
  .roles-permissions .cancel-btn {
    padding: 4px 6px;
    font-size: 13px;
  }

  /* My Tasks */
  .search-add-fbox {
    flex-direction: column;
  }

  .my-tasks .searchBar {
    width: 100%;
  }

  /* Roles & Permissions  */
  .roles-permissions .save-cancel-sec {
    width: 50%;
    text-align: end;
  }

  .roles-permissions .section-title h6 {
    font-size: 15px;
  }

  .roles-permissions .save-btn,
  .roles-permissions .cancel-btn {
    padding: 4px 6px;
    font-size: 13px;
  }
}


/* SYJ Roles & Permissions */
.roles-permissions-body {
  padding-bottom: 3rem;
}

.roles-permissions {
  padding-bottom: 16px;
}

.roles-permissions .grid-sec {
  background-color: #EBE6F5;
  padding: 8px;
  border-radius: 4px;
  box-shadow: 0 3px 6px #00000029;
}

.roles-permissions .section-title-fbox {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 5px;
}

.roles-permissions .section-title h6 {
  font-size: 16px;
  font-family: Lato-Bold;
  color: #4E4E4E;
  margin-bottom: 0;
}

.roles-permissions .save-btn {
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: 1px solid #483567;
  padding: 4px 10px;
}

.roles-permissions .cancel-btn {
  border: 1px solid #483567;
  color: #483567;
  background-color: #fff;
  border-radius: 5px;
  /* border: none; */
  padding: 4px 10px;
}

.roles-permissions .custom-grid-sec td {
  background-color: #ffffff;
  /* text-align: left; */
  padding: 3px 5px 4px;
  border-bottom: 3px solid #EBE6F5;
  font-family: Lato-Regular;
}

.roles-permissions .permission-type {
  font-family: Lato-Medium;
}


/* Active Inactive Toggle  */
.roles-permissions .toggle-col {
  align-self: center;
  /* padding-left: 75px; */
  /* text-align-last: center !important; */
}

.roles-permissions .toggle-col .toggle {
  position: relative;
  /* display: block; */
  padding-top: 0;
  width: fit-content;
  height: 22px;
  padding: 3px;
  margin: auto;
  border-radius: 50px;
  cursor: pointer;
}

.roles-permissions .toggle-col .toggle-input {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.roles-permissions .toggle-col .toggle-label {
  position: relative;
  display: block;
  height: 22px;
  width: 50px;
  font-size: 12px;
  background: #800000;
  border-radius: inherit;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12),
    inset 0 0 3px rgba(0, 0, 0, 0.15);
}

.roles-permissions .disable-toggle {
  background: #808080 !important;
  cursor: no-drop !important;
}

.roles-permissions .toggle-col .toggle-label:before,
.roles-permissions .toggle-col .toggle-label:after {
  position: absolute;
  top: 50%;
  color: black;
  margin-top: -0.5em;
  line-height: 1;
}

.roles-permissions .toggle-col .toggle-label:before {
  content: attr(data-off);
  right: 11px;
  color: #fff;
  text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}

.roles-permissions .toggle-col .toggle-label:after {
  content: attr(data-on);
  left: 11px;
  color: #fff;
  text-shadow: 0 1px rgba(0, 0, 0, 0.2);
  opacity: 0;
}

.roles-permissions .toggle-col .toggle-input:checked~.toggle-label {
  background: rgba(0, 128, 0);
}

.roles-permissions .toggle-col .toggle-input:checked~.toggle-label:before {
  opacity: 0;
}

.roles-permissions .toggle-col .toggle-input:checked~.toggle-label:after {
  opacity: 1;
}

.roles-permissions .toggle-col .toggle-handle {
  position: absolute;
  top: 4px;
  left: 4px;
  width: 20px;
  height: 20px;
  background: linear-gradient(to bottom, #ffffff 40%, #f0f0f0);
  border-radius: 50%;
}

.roles-permissions .toggle-col .toggle-handle:before {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -6px 0 0 -6px;
  width: 16px;
  height: 16px;
}

.roles-permissions .toggle-col .toggle-input:checked~.toggle-handle {
  left: 32px;
  box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

.custom-grid-sec th {
  background-color: #684e85;
  color: #ffffff;
  text-align: left;
  padding: 8px;
  font-family: Lato-Medium;
}

/* .table-header{
  text-align: center !important;
} */
.custom-grid-sec td {
  background-color: #ffffff;
  text-align: left;
  padding: 8px;
  border-bottom: 5px solid #f7f8fc;
  font-family: Lato-Regular;
}

.custom-grid-sec .table-main {
  width: 100%;
  display: inline-table;
}

.custom-grid-sec .td-th-alignment {
  text-align: center;
}

.custom-grid-sec {
  overflow-x: auto;
  display: contents;
}

.add-employee .bubble-sec .bubble-display {
  background-color: rgb(197, 197, 236);
  border: 2px solid rgb(197, 197, 236);
  padding: 7px 17px;
  max-width: 160px;
  margin-right: 8px;
  border-radius: 30px;
  display: inline-block;
  margin-top: 6px;
}

.add-employee .bubble-sec .bubble-display div {
  font-family: Lato-bold !important;
}

/* Transition*/
.roles-permissions .toggle-col .toggle-label,
.roles-permissions .toggle-col .toggle-handle {
  transition: All 0.3s ease;
  -webkit-transition: All 0.3s ease;
  -moz-transition: All 0.3s ease;
  -o-transition: All 0.3s ease;
}


/* End of Active Inactive Toggle */
/* Link Expired */
.link-expired {
  background-color: #fff;
  min-height: 100vh;
  padding-inline: 20px;
}

.link-expired .custom-height {
  min-height: 100vh;
}

.link-expired .link-expired-img-sec,
.link-expired .link-expired-info-sec {
  align-self: center;
}

.link-expired .link-expired-header h3 {
  font-size: 40px !important;
  font-family: Lato-Bold;
  color: #9966CB;
}

.link-expired .link-expired-text p {
  font-size: 19px;
  font-family: Lato-Bold;
  color: #656565;
}

.link-expired .link-expired-img-sec img {
  width: 100%;
}

.link-expired .back-to-login-btn {
  background-color: #9966CB;
  color: #fff;
  padding: 4px 14px;
  font-family: Lato-Medium;
  border-radius: 4px;
  border: none;
}

/* Link Expired End */

/* Roles & Permissions End */


.my-tasks-body,
.project,
.main-body-content,
.main-body-content-Edit-Issue {
  padding-bottom: 4rem;

}

.my-tasks-body,
.main-body-content-project,
.add-employee-body {
  min-height: calc(100vh - 35px);
}

@media screen and (max-width: 1439px) {

  .my-tasks-body,
  .main-body-content-project {
    min-height: calc(109vh + 6px);
  }
}

@media screen and (max-width: 1439px) {
  .add-employee-body {
    min-height: calc(109vh - 1px);
  }
}

@media screen and (max-height: 768px) {
  .add-employee-body {
    min-height: calc(109vh - 28px) !important;
  }
}

/* @media screen and (max-width: 1440px) {
  .add-employee-body {
      min-height: calc(109vh + 13px);
  }
} */

.manageUsers,
.main-body-content {
  padding-bottom: 0.5rem;
}

.overview,
.main-body-content {
  padding-bottom: 2rem;
}

.main-body-content-project {
  padding-bottom: 4rem;

}



.timeLog {
  padding-bottom: 4rem;
  background-color: #f5f5f5;
}

.custom-project-height{
  min-height: calc(100vh - 40px) !important;
}

@media screen and (max-width: 1439px) {
  .custom-project-height {
    min-height: calc(109vh - 5px) !important;
  }

  .timelog-custom-height {
    min-height: calc(100vh + 12px) !important;
  }
}

.main-header-admin {
  background-color: #483567;
  position: sticky;
  top: 0;
  z-index: 100;
}

.sticky-item {
  position: sticky;
  top: 96px;
  /* z-index: 999; */
  /* padding-block: 15px; */
  padding: 7px 0px 7px 0px;
  background-color: #fff;
}

@media screen and (min-width: 651px) and (max-width: 880px) {
  .sticky-item {
    top: 123px;
  }
}

@media screen and (min-width: 531px) and (max-width: 650px) {
  .sticky-item {
    top: 170px;
  }
}

@media screen and (min-width: 322px) and (max-width: 530px) {
  .sticky-item {
    top: 220px;
  }
}

@media screen and (max-width: 321px) {
  .sticky-item {
    top: 268px;
  }
}

/* My Tasks */
.my-tasks {
  /* padding-top: 1rem; */
  padding-bottom: 4rem;
}

.my-tasks .collapsible-sec-pos {
  position: relative;
  background-color: #EBE6F5;
  padding: 5px 8px 5px;
  border-radius: 5px;
  box-shadow: 0 3px 6px #00000029;
}

.my-tasks .collapsible-sec-header {
  padding-left: 25px;
  background-color: #EBE6F5;
  padding-right: 8px;
  /* padding-block: 4px; */

}

.my-tasks .collapsible-sec-pos .collapsible-btn {
  border: none;
  border-radius: 3px;
  padding: 0 5px 0 4px;
  position: absolute;
  top: 10px;
  color: #fff;
  background-color: #483567;
  left: 9px;
  font-size: 10px;
}

.my-tasks .collapsible-sec-pos .active i {
  transform: rotate(90deg);
}

.my-tasks .collapsible-sec-pos .collapsible-header-text {
  font-size: 18px;
  font-family: Lato-Bold;
  color: #4E4E4E;
}


.my-tasks .collapsible-sec-pos .contentt {
  display: none;
}

.my-tasks .custom-grid-sec td {
  background-color: #ffffff;
  /* text-align: left; */
  padding: 2px 8px;
  border-bottom: 3px solid #EBE6F5;
  font-family: Lato-Medium;
}

.my-tasks .search-add-fbox {
  display: flex;
  justify-content: space-between;
}

.pending-status {
  background-color: #85784E;
  color: #fff;
  font-size: 14px;
  padding: 2px 8px;
  border-radius: 3px;
  text-wrap: nowrap;
}

.completed-status {
  background-color: #11A500;
  color: #fff;
  font-size: 14px;
  padding: 2px 8px;
  border-radius: 3px;
  text-wrap: nowrap;
}

.my-tasks .task-id {
  color: #0011FF;
  font-weight: 500;
  text-decoration: underline;
}

.my-tasks .searchBar {
  /* width: 300px; */
  display: flex;
  flex-direction: row;
  align-items: center;
  background-color: #f5f5f5;
}

.my-tasks .custom-top-spacing {
  margin-top: 32px;
}

.my-tasks #searchQueryInput {
  width: 100%;
  height: 38px;
  outline: none;
  border: 1px solid rgb(72, 53, 103);
  border-radius: 5px;
  padding: 6px 10px;
  font-size: 13px;
}

.my-tasks #searchQuerySubmit {
  width: 2.5rem;
  height: 1.8rem;
  margin-left: -3.2rem;
  background: #ffffff;
  border: none;
  outline: none;
}

.my-tasks .add-task-sec {
  text-align: end;
}

.my-tasks .alignment-vertical {
  align-self: self-end;
}

.my-tasks .add-task-btn {
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: none;
  padding: 4px 10px;
}

.my-tasks label {
  font-family: Lato-Bold;
  font-size: 15px;
  color: #363636;
}

.custom-dropdown {
  line-height: 1.35 !important;
  font-family: Lato-Regular;
}

.my-tasks .custom-grid-sec tr:hover td {
  background-color: #dad3e7 !important;
}

.my-tasks .custom-grid-sec td {
  cursor: move !important;
}

/* My Tasks End */

.custom-depth {
  z-index: 999999 !important;
}

/* Edit Task */
.edit-task {
  padding-bottom: 4rem;
}

.edit-task label {
  font-family: Lato-Bold;
  color: #4E4E4E;
  font-size: 14px;
}

.edit-task .sub-task-link {
  font-family: Lato-Medium;
}

.custom-input-ns:focus {
  box-shadow: none !important;
  border-color: #8b8b8b !important;
}

.edit-task .time-track-grid-header-fbox {
  display: flex;
  justify-content: space-between;
  padding: 1px 1px;
  align-items: center;
  /* background-color: #EBE6F5; */
}

.time-track-grid-header-fbox .add-icon img {
  width: 20px;
  margin-bottom: 2px;
}

.edit-task .custom-grid-sec {
  overflow-x: auto;
}

.edit-task .custom-grid-sec .custom-grid {
  width: 100%;
}

.edit-task .custom-grid-sec .custom-grid th {
  padding: 4px 5px;
  border-block: 1px solid #A8A8A8;
  background-color: #EFEFEF;
  color: #4E4E4E;
}

.edit-task .custom-grid-sec .custom-grid td {
  padding: 2px 5px;
  border-block: 1px solid #A8A8A8;
  background-color: #fff;
  font-family: Lato-Medium;
  color: #4E4E4E;
  text-wrap: nowrap;
}

.edit-task .custom-grid-sec .custom-grid .align-center {
  text-align: center;

}

.edit-task .file-upload-btn {
  width: 100%;
  /* min-height: 165px; */
  min-height: 190px;
  max-height: 280px !important;
  background-color: #FBF9FF;
  border: 2px dashed #A5A5A5;
  border-radius: 3px;
  align-content: center;
  overflow-y: scroll;
}

.edit-task .file-upload-btn .file-upload {
  display: none;
}

.edit-task .file-upload-btn .upload-icon img {
  width: 28px;
}

.edit-task .file-upload-btn .file-upload-txt {
  font-family: Lato-Medium;
  color: #6E6E6E;
  text-align: center;
}

.edit-task .brief-info-sec {
  margin-top: 5px;
}

.edit-task .brief-info-sec span {
  color: #777777;
  font-family: Lato-Medium;
  margin-left: 8px;
}

.edit-task .brief-info-sec label {
  width: 78px;
}

.brief-info-sec-estimation label {
  width: 160px;
}


/* .edit-task .edit-task-accordion{
  padding: 4% 0;
} */

/* .edit-task .accordion{
width: 90%;
} */

/* .edit-task .accordion-header{
padding: 15px 0 0px;
} */

.edit-task .accordion-item {
  background-color: transparent;
  border: none;
  box-shadow: 0 3px 6px #00000029;
}

.edit-task .accordion-item:first-of-type .accordion-button {
  /* border-radius: 4px !important; */
  border-top-right-radius: 8px !important;
  border-top-left-radius: 8px !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  background-color: #EBE6F5;
  color: #4E4E4E;
  padding-block: 8px !important;
}

.edit-task .accordion-item:last-of-type .accordion-button.collapsed {
  border-radius: 8px !important;
  /* border-bottom-left-radius: 25px !important; */
  background-color: #EBE6F5;
  color: #4E4E4E;
  padding-block: 8px !important;
  /* z-index: -9; */
}

/* .edit-task .accordion-button:not(.collapsed){

} */

.edit-task .accordion-body {
  background-color: #fff;
  border-radius: 0px 0px 8px 8px;
  font-family: Lato-Regular;
  border-top: 1px solid #A8A8A8;
}

.edit-task .accordion-button {
  border-radius: 25px !important;
  box-shadow: 0px 3px 6px #00000029;
  font-family: Lato-Bold;
}

.edit-task .accordion-button:focus {
  border-color: #00000000 !important;
  box-shadow: unset;
}

.edit-task .accordion-button:not(.collapsed) {
  background-color: #EBE6F5;
  color: #4E4E4E;
  border-top-left-radius: 25px !important;
  border-top-right-radius: 25px !important;
  border-bottom-right-radius: calc(0.25rem - 1px) !important;
  border-bottom-left-radius: calc(0.25rem - 1px) !important;
}

.edit-task .accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%234e4e4e'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  transform: rotate(0deg);
}

.edit-task .accordion-button::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%234e4e4e'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  transform: rotate(-180deg);
}

.edit-task .accordion-body .collapsing {
  transition-delay: 0 !important;
  transition: height 1.5s !important;
}

.edit-task .sharepoint-upload {
  border: 1px solid #483567;
  background-color: #EBE6F5;
  padding: 2px 16px;
  border-radius: 3px;
}

.edit-task .sharepoint-upload img {
  width: 18px;
  margin-bottom: 3px;
  margin-right: 3px;
}

.activity-link-tab {
  display: flex;
  padding-top: 0px !important;
  padding-bottom: 5px;
}

.edit-task .tablinks span {
  /* margin: auto; */
  /* margin-left: 3%; */
  /* vertical-align: text-top; */

  color: #4E4E4E;
  font-size: 15px;
}

.edit-task .activity-link-tab button.active {
  background-color: #E0D5F5 !important;
}

.edit-task .activity-link-tab button {
  background-color: #F5F5F5;
}

.edit-task .activity-link-tab button:hover {
  background-color: #ece7f5;
}





.edit-task .comment-tab {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  padding: 4px 12px;
  border: none;
}

.edit-task .history-tab {
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  padding: 4px 12px;
  border: none;
}

.edit-task .tabcontent .profile-name-fbox,
.edit-task .tabcontent .date-hours-fbox,
.edit-task .tabcontent .history-profile-name-fbox {
  display: flex;
  align-items: center;
}

.edit-task .tabcontent .profile-name-fbox .profile-sec {
  height: 45px;
  width: 45px;
  /* background-color: #ECE2FF; */
  border-radius: 50%;
  text-align: center;
  align-content: center;
  margin-right: 12px;
  align-items: center;
  display: flex;
  justify-content: center;
}

.edit-task .tabcontent .profile-name-fbox .profile-sec img {
  height: 45px;
  width: 45px;
  border-radius: 50%;
}

.edit-task .tabcontent .spaced-border {
  border-bottom: 1px solid #a8a8a8;
  padding-block: 10px;
}

.edit-task .tabcontent .history-profile-name-fbox .profile-sec {
  height: 30px;
  width: 30px;
  /* background-color: #ECE2FF; */
  border-radius: 50%;
  text-align: center;
  align-content: center;
  margin-right: 12px;
  align-items: center;
  justify-content: center;
  display: flex;
}


.edit-task .tabcontent .profile-name-fbox .profile-sec .profile-initials {
  font-size: 15px;
  color: #483567;
  font-family: Lato-Regular;
}

.edit-task .tabcontent .history-profile-name-fbox .profile-sec .profile-initials {
  font-size: 12px;
  color: #483567;
  font-family: Lato-Regular;
}

.edit-task .tabcontent .profile-name-fbox .profile-name-sec {
  font-size: 15px;
  color: #4E4E4E;
  font-family: Lato-Medium;
}

.edit-task .tabcontent .history-profile-name-fbox .profile-name-sec {
  font-size: 15px;
  color: #4E4E4E;
  font-family: Lato-Medium;
}

.edit-task .tabcontent .history-profile-name-fbox .profile-name-sec .update-txt {
  font-family: Lato-Regular !important;
}

.edit-task .tabcontent .date-sec {
  margin-right: 50px;
}

.edit-task .tabcontent .date-hours-fbox span {
  color: #707070;
  font-size: 14px;
}

.edit-task .tabcontent .comment-sec {
  margin-top: 8px;
}

.edit-task .tabcontent .comment-sec span {
  color: #4E4E4E;
  font-size: 15px;
  font-family: Lato-Medium;
}

.edit-task .comment-btn-sec .comment-btn {
  border: none;
  background-color: #483567;
  color: #fff;
  padding: 4px 10px;
  border-radius: 5px;
}

.edit-task .comment-btn-sec .comment-btn i {
  font-size: 20px;
}

.edit-task .save-cancel-sec {
  text-align: end;
}

.edit-task .save-btn {
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: none;
  padding: 4px 10px;
  border: 1px solid #483567;
  margin-right: 3px;
}

.edit-task .cancel-btn {
  border: 1px solid #483567;
  color: #483567;
  background-color: #fff;
  border-radius: 5px;
  /* border: none; */
  padding: 4px 10px;
}

.edit-task .custom-history-grid-sec {
  overflow-x: auto;
}

.edit-task .custom-history-grid-sec .custom-grid {
  width: 100%;
}

.edit-task .custom-history-grid-sec .custom-grid th {
  padding: 4px 5px;
  background-color: #684E85;
  color: #fff;
  font-size: 15px;
}

.edit-task .custom-history-grid-sec .custom-grid td {
  padding: 4px 5px;
  background-color: #ededed;
  font-family: Lato-Medium;
  color: #363636;
  text-wrap: wrap;
  font-size: 14px;
  width: 30% !important;
}

.edit-task .task-type {
  font-family: Lato-Medium;
  color: #363636;
  font-size: 15px;
}

.tablinks {
  background-color: #f2f2f2;
  border: 1px solid #ccc;
  padding: 10px 20px;
  cursor: pointer;
  font-family: Lato-Medium;
}

.tablinks.active {
  background-color: #ddd;

}

.tabcontent {
  display: none;
  /* padding: 0px 20px;
  border: 1px solid #ccc; */
}



.tabcontent.active {
  display: block;

}

/* Edit Task End */

.profile-edit-delete-fbox {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* .activity-link-tab tablinks comment-tab Active {
  background-color: #ece7f5;
} */

.activity-link-tab .tablinks.Active {
  background-color: #d5c7ee !important;
  font-family: Lato-Bold !important;
}



/* Override CKEditor's default styles */
.ck.ck-editor__main>.ck-editor__editable:not(.ck-focused) {
  border-color: var(--ck-color-base-border);
}

/* Apply 150px height to CKEditor's content area */
.ck.ck-editor__editable:not(.ck-focused) {
  min-height: 220px !important;
  /* Important to ensure it overrides CKEditor's styles */
  overflow-y: auto;
  /* Add scrollbar when content exceeds height */
}

.file-hover .delete-attachment {
  visibility: hidden;
}

.file-hover:hover .delete-attachment {
  visibility: visible;
}

/* SYJ ContextMenu Style */
.contex-menu {
  position: absolute;
  background-color: #ffffff;
  border: 2px solid #636363;
  box-shadow: 0px 4px 8px rgba(183, 181, 181, 0.1);
  padding: 5px;
  z-index: 1;
  top: 40px;
  right: 5px;
  width: 180px;
}

.context-menu:before {
  content: "";
  position: absolute;
  bottom: 100%;
  border-width: 10px;
  border-style: solid;
  border-color: transparent transparent #000 transparent;
}

.delete-context {
  width: 98%;
  display: block;
  padding: 5px;
}

.delete-context:hover {
  background-color: #c8c7c7;
}

.linkSec a {
  word-break: break-all;
}


.calendar-container {
  display: flex;
}

.calendar {
  flex: 1;
}

.custom-row {
  padding-top: 70px;
  flex: 0 0 200px;
  /* Adjust width as needed */
  display: flex;
  flex-direction: column;
}

.week-total {
  border: 1px solid #000;
  padding: 10px;
  text-align: center;
  margin-bottom: 10px;
  height: 100px;
  align-content: center;
}


/* Timetracker */
.time-tracker {
  padding: 16px 30px;
  padding-bottom: 4rem;
}

.time-tracker .time-track-main {
  padding: 10px;
  background-color: #EBE6F5;
  box-shadow: 0 3px 6px #00000029;
}

.time-tracker .switch-month-hours-fbox {
  display: flex;
  /* align-items: center; */
  flex-wrap: wrap;
}

.time-tracker .switch-month-sec {
  display: flex;
  margin-right: 36px;
  /* align-items: center; */
  margin-bottom: 8px;
}

.time-tracker .switch-month-sec .previous-switch {
  margin-right: 8px;
  color: #4E4E4E;
}

.time-tracker .switch-month-sec .month-sec {
  font-family: Lato-Medium;
  font-size: 18px;
  /* color: #4E4E4E; */
}

.time-tracker .switch-month-sec .next-switch {
  margin-left: 8px;
  color: #4E4E4E;
}

.time-tracker .current-month-hours-sec {
  margin-bottom: 8px;
}

.time-tracker .current-month-hours-sec .current-month-txt {
  font-size: 18px;
  /* color: #818181; */
  font-family: Lato-Regular;
  margin-right: 4px;
  font-weight: 500;
}

.time-tracker .current-month-hours-sec .month-hours {
  padding: 2px 6px;
  font-size: 15px;
  font-family: Lato-Medium;
  background-color: #F6F6F6;
  color: #4E4E4E;
  border-radius: 2px;
}

.time-tracker .timetracker-grid-sec {
  overflow-x: auto;
}

.time-tracker .timetracker-sub-grid-sec {
  padding: 10px;
  background-color: #CAC0DC;
}

.time-tracker .timetracker-grid-sec .tab-width {
  width: 100%;
}

.time-tracker .timetracker-grid-sec th {
  background-color: #684E85;
  padding: 4px 8px;
  color: #fff;
  font-family: Lato-Medium;
  border: 1px solid #684E85;
}

.time-tracker .timetracker-grid-sec td {
  background-color: #fff;
  position: relative;
  height: 100px;
  width: 12.5%;
  align-self: center;
  text-align: center;
  font-size: 19px;
  color: #363636;
  font-family: Lato-Medium;
  border: 1px solid #BBBBBB;
}

.timetracker-grid-sec .ag-cell {
  cursor: auto !important;
  padding-top: 0 !important;
  align-content: center;
}

.time-tracker .timetracker-grid-sec .selected-date {
  border: 2px solid #684E85 !important;
}

.time-tracker .timetracker-grid-sec .date-track {
  position: absolute;
  left: 7px;
  top: 3px;
  font-size: 13px;
  color: #717171;
  font-family: Lato-Regular;
}

.time-tracker .timetracker-grid-sec .previous-next-month-date {
  background-color: #E5E5E5 !important;
  font-weight: bold;
}

.time-tracker .timetracker-grid-sec .sub-table {
  /* border: 10px solid #CAC0DC; */
  overflow-x: auto;
}

.time-tracker .timetracker-grid-sec .add-time-log-btn-sec {
  height: fit-content;
  text-align: start;
  background-color: #EFEFEF;
}

.time-tracker .timetracker-grid-sec .add-time-log-btn {
  background-color: transparent;
  font-size: 16px;
  font-family: Montserrat-Medium;
  border: none;
}

.time-tracker .timetracker-grid-sec .add-time-log-btn img {
  width: 16px;
  margin-right: 6px;
}

.sub-table td {
  height: fit-content !important;
  padding: 4px 8px;
  font-size: 14px !important;
  text-align: left !important;
  text-wrap: nowrap;
  overflow-x: auto;
  border: none !important;
}

.sub-table th {
  text-wrap: nowrap;
  font-size: 15px !important;
}

/* Timetracker End */

/* #root > main > section.add-time-log-body > div > div > div:nth-child(1) > div.col-6.col-md-6.col-lg-3 > div > div > div > svg{
  right: 12px;
} */

.react-datepicker__input-container .react-datepicker__calendar-icon {
  right: 12px !important;
}

.add-time-log .react-datepicker__view-calendar-icon input {
  padding: 5px 0.75rem !important;
  width: 100%;
}

.add-time-log .react-datepicker-wrapper {
  width: 100%;
}

.add-time-log .custom-padding {
  padding-inline: 20px;
}

.add-time-log .timeSpent {
  width: 45px !important;

  padding: 2px !important;

  height: 30px !important;
}


/* Remove Line Between edit and trash icon in project and employee*/
.ag-pinned-right-header {
  border: none !important;
}

.ag-cell.ag-cell-first-right-pinned:not(.ag-cell-range-left):not(.ag-cell-range-single-cell) {
  border-left: none !important;
}

.page-not-found-main {
  min-height: 100vh;
  background-color: #fff;
  align-content: center;
  text-align: center;
  padding-bottom: 5rem;
  zoom: 1.11;
  zoom: 111%;
}

.page-not-found-main img {
  width: 500px;
}

.page-not-found-main h1 {
  color: #684E85;
  font-family: Lato-Bold;
  font-size: 36px;
}

.page-not-found-main p {
  color: #363636;
  font-family: Lato-Medium;
  font-size: 20px;
}

.page-not-found-main .home-btn {
  background-color: #684E85;
  font-family: Lato-Medium;
  color: #fff;
  font-size: 16px;
  padding: 4px 16px;
  border: none;
  border-radius: 5px;
  font-weight: 500;
}

.page-not-found-main .home-btn:hover {
  background-color: #45325a;
}

@media screen and (max-width: 500px) {
  .page-not-found-main img {
    width: 100%;
  }
}

/* PU-264 */

.box_file2_comment .avatar-name-fbox {
  display: flex;
  align-items: center;
}

.avatar-name-fbox .avatar-name-spacing {
  padding-left: 5px;
}

.box_file2_comment .detail.Initials-edit-issue {
  padding: 2px 4px;
  background-color: #8800c1;
  border-radius: 50px;
  color: white;
  margin-top: 8px;
  margin-top: 4px;
}

.box_file2_comment .initial-text-edit-issue {
  margin-bottom: 0;
}


.timetracker-sub-grid-sec .sub-table {
  padding: 10px;
  background-color: #E5E5E5 !important;
}

/* Profile Header */
.header-profile-sec {
  position: relative;
}

.header-profile-sec .header-profile {
  height: 60px;
  width: 60px;
  border-radius: 50%;
  background-color: #B5A5C4;
  color: #fff;
  font-size: 18px;
  text-align: center;
  align-content: center;
}

.header-profile-sec .header-profile-anc {
  text-decoration: none;
}

.header-profile-sec img {
  object-fit: cover;
  object-position: center;
  height: 60px;
  width: 60px;
  border-radius: 50%;
}

.header-profile-sec .profile-menu-sec {
  position: absolute !important;
  background-color: #fff;
  box-shadow: 0 3px 6px #00000029;
  border-radius: 4px;
  left: -185px !important;
  top: 45px !important;
  padding: 10px 14px;
  min-width: 280px;
  border: 1px solid #D5D5D5 !important;
}

.dropdown-toggle::after {
  display: none !important
}

@media screen and (max-width: 991px) {
  .header-profile-sec .profile-menu-sec {
    left: -7px !important;
    top: 65px !important;
  }
}

.header-profile-sec .profile-menu-sec .profile-name-fbox {
  display: flex;
  align-items: center;
  gap: 10px;
}

.header-profile-sec .menu-profile {
  height: 50px;
  width: 50px;
  border-radius: 50%;
  /* background-color: #B5A5C4; */
  color: #fff;
  font-size: 17px;
  text-align: center;
  align-content: center;
}

.header-profile-sec .menu-profile img {
  object-fit: cover;
  object-position: center;
  height: 50px;
  width: 50px;
  border-radius: 50%;
}


.header-profile-sec .profile-name {
  font-size: 22px;
  font-family: Lato-Bold;
  color: #4E4E4E;
  text-align: left;
  margin-bottom: 0;
}

.header-profile-sec .profile-email {
  font-size: 14px;
  font-family: Lato-Regular;
  color: #4E4E4E;
  margin-bottom: 0;
  text-align: left;
}

.header-profile-sec .view-logout-fbox {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 8px;
}

.header-profile-sec .view-profile,
.header-profile-sec .logout-sec {
  text-decoration: underline;
  color: #1C6FFF;
  font-size: 15px;
  font-family: Lato-Regular;
  cursor: pointer;
}

/* Profile Header End */

@media screen and (max-width: 404px) {
  .page-not-found-main {
    padding-bottom: 7rem;
  }
}

/* TimePicker.css */

/* Styling the container of the TimePicker */
.react-time-picker {
  width: 100%;
  max-width: 200px;
}

.react-time-picker__wrapper {
  border: 1px solid #ced4da;
  border-radius: 4px;
  padding: 5px;
}

/* Input field inside the TimePicker */
.react-time-picker__inputGroup__input {
  height: 35px;
  font-size: 14px;
  border: none;
}

/* Customizing the divider between hours and minutes */
.react-time-picker__inputGroup__divider {
  padding: 0 5px;
}

/* Customizing the buttons inside the TimePicker */
.react-time-picker__button {
  display: none;
  /* Hide the clock icon button if not needed */
}


.react-time-picker__inputGroup__input {
  height: auto;
  /* Reset the height */
  font-size: inherit;
  /* Inherit font size */
  line-height: inherit;
  /* Inherit line height */
  padding-top: 0.375rem;
  /* Adjust top padding as needed */
  padding-bottom: 0.375rem;
  /* Adjust bottom padding as needed */
}

#hrs::-webkit-outer-spin-button,
#hrs::-webkit-inner-spin-button,
#min::-webkit-outer-spin-button,
#min::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

#hours::-webkit-outer-spin-button,
#hours::-webkit-inner-spin-button,
#mins::-webkit-outer-spin-button,
#mins::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
.log-hours-main input[type=number] {
  -moz-appearance: textfield;
}

.hrsMin {

  width: fit-content;
  border: 1px solid #ced4da;
  border-radius: 4px;
  padding: 4px 3px 4px 8px;

}

.estimatedRow {
  font-family: Lato-Bold !important;
}

.green {
  color: green !important;
}

.red {
  color: red !important;
}

.tab-width td:hover {
  border: 2px solid #684E85 !important;
}

.table-hover td {
  transition: border-color 0.3s ease;
}

.table-hover td:hover {
  border: 1px solid yellow;
  /* Change the border color on hover */
}

.addtimelog {
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: 1px solid #483567;
  padding: 4px 10px;
  margin-right: 5px;
  font-weight: 500;
}

@media screen and (max-width: 767px) {
  .addtimelog {
    margin-top: 12px;
  }
}

th {
  font-weight: 500;
}

.custom-width {
  width: 70px !important;
  text-align: center;
  text-align-last: center;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
  img {
    content: url(profileImage);
  }
}


/* 
.user-profile-img-sec {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 150px;
  width: 150px;
  border-radius: 50%;
  overflow: hidden;
}

.user-profile-img {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
} */

.crop-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: white;
  padding: 20px;
  border-radius: 8px;
  z-index: 1000;
  width: 212px !important;
  height: 212px !important;
}


.crop-modal .react-easy-crop-container {
  position: relative;
  width: 100%;
  height: 400px;
  /* Adjust the height as needed */
  background: #333;
}

.crop-controls {
  display: flex;
  justify-content: space-between;
  margin-top: 116px;
}

.crop-controls button {
  padding: 10px 20px;
  cursor: pointer;
}

.crop-modal button {
  margin: 10px;
}


.toast-link {
  color: white !important;
  text-decoration: underline;
  /* Optional: to distinguish links clearly */
}

.toast-link-Add {
  color: white !important;
  text-decoration: underline;
  /* Optional: to distinguish links clearly */
}

.overview-task-name-spacing {
  cursor: default;
}

@media screen and (min-width: 1200px) {
  .growth-flex {
    flex: 1;
  }
}

@media screen and (max-width: 1199px) {
  .growth-flex {
    flex: auto;
  }
}

.manageUsers .ag-row-hover {
  cursor: default;
}

.timeLog .ag-row-hover {
  cursor: default;
}


.accordian-devstyle:not(.collapsed) {

  cursor: default;
}


/* Model Assign Employee */
@media screen and (min-width: 768px) {
  .modal-dialog-custom {
    max-width: 630px !important;
  }
}

button {
  font-weight: 500 !important;

}

.time-details-fbox {
  display: flex;
  align-items: center;
  gap: 4px;
}

.dropdown-menu {

  /* padding:2px 2px !important; */

}

.button-container {
  display: flex;
  flex-direction: column;
  padding: 0;
  /* Remove padding */
  margin: 0;
  /* Remove margin */
}

.daily-button,
.monthly-button {
  width: 100%;
  padding: 10px;
  /* Adjust padding as needed */
  margin: 0;
  /* Remove margin */
  text-align: left;
  border: 1px solid #ccc;
  /* Optional: Add a border */
  background-color: 'white';
  cursor: pointer;
  box-sizing: border-box;
  /* Ensures padding and border are included in the width */
}

.daily-button:hover,
.monthly-button:hover {
  background-color: #ece6f2;
  /* Optional: Change background color on hover */

}

.scrollable-container {
  height: calc(100vh - 205px);
  /* Adjust as needed */
  overflow-y: auto;
  /* Enable vertical scrolling */
  overflow-x: hidden;
  /* Disable horizontal scrolling */

}

@media screen and (max-width: 1439px) {
  .scrollable-container {
    height: calc(100vh - 95px);
  }

}

.proceed-btn {
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: none;
  padding: 5px 8px;
  border: 1px solid #483567;
  margin-right: 3px;
  width: 80px;
  color: white !important;
  text-align: center !important;
  font-family: Lato-Regular !important;
}

.proceed-cancel-btn {
  border: 1px solid #483567;
  color: #483567;
  background-color: #fff;
  border-radius: 5px;
  padding: 5px 8px;
  width: 80px;
}


/* START - CKEditor */

.ck-editor__editable_inline:not(.ck-comment__input *) {
  height: 220px;
  overflow-y: auto;
}

.ck .ck-sticky-panel .ck-sticky-panel__content_sticky {
  position: static !important;
  /* display: none !important; */
}

.ck .ck-sticky-panel .ck-sticky-panel__content .ck-toolbar .ck-toolbar__items>* {
  z-index: 3;
}

.ck.ck-dropdown__panel {
  max-height: 180px;
  overflow-y: auto;
}

.ck-toolbar__items {
  z-index: 0 !important;
}

/* END */

.custom-filter-sizing .css-f6k9v2-control,
.custom-filter-sizing .css-hz6k6c-control {
  min-height: 32px !important;
}

.custom-filter-sizing .css-1xc3v61-indicatorContainer,
.custom-filter-sizing .css-15lsz6c-indicatorContainer {
  padding: 5px !important;
}

.td-th-alignment {
  text-align: center;
}

.create-sprint-modal .tabcontent {
  padding: 0 !important;
  border: none !important;
}

@media screen and (min-width: 768px) and (max-width: 991px) {
  .modal-custom-width {
    max-width: 700px !important;
  }
}


@media screen and (min-width: 992px) {
  .modal-custom-width {
    max-width: 745px !important;
  }

  .create-sprint-modal .modal-custom-width {
    min-width: 900px !important;
  }
}

@media screen and (max-width: 767px) {
  .create-sprint-modal .table-main {
    display: block !important;
  }
}

.create-sprint-modal .table-main td {
  text-align: center !important;
  background-color: #f5f5f5;
  border-bottom: 4px solid #fff !important;
}

.create-sprint-modal .comment-tab {
  padding: 5px 22px;
  border: none;
  border-bottom-left-radius: 5px;
  border-top-left-radius: 5px;
}

.create-sprint-modal .history-tab {
  padding: 5px 22px;
  border: none;
  border-bottom-right-radius: 5px;
  border-top-right-radius: 5px;
}

.file-upload-sec {
  position: relative;
}

.paste-img-btn {
  position: absolute;
  top: 1px;
  left: 1px;
  background-color: #A694C2;
  color: #fff;
  font-family: Lato-Regular;
  font-size: 14px;
  border-radius: 4px;
  border: none;
  padding-block: 3px;
  padding-inline: 12px;
}


a.disabled {
  pointer-events: none;
  cursor: default;
}

.edit-icon {
  display: none;
}

.title-hover-sec:hover .edit-icon {
  display: block;
}

.editor-icon {
  /* height: 100%; */
  width: 20px;
  position: absolute;
  background-color: rgb(72 53 103 / 40%);
  bottom: 0;
  right: 0;
  z-index: 9;
  text-align: center;
  align-content: center;
  display: none;
}

.editor-parent:hover .editor-icon {
  display: block;
}

.editor-save-cancel-sec {
  /* position: absolute; */
  /* bottom: 0; */
  /* width: 100%; */
  text-align: end;
  padding: 9px 12px 3px;
  border: 1px solid #ccced1;
  z-index: 1;
  background-color: #fff;
}


.edit-title-action-icon {
  height: 20px;
}

.edit-title-action-btn {
  background-color: #ecedf0;
  padding: 1px 4px;
  border: none;
  border-radius: 4px;
  width: 25px;
}

.edit-control-action-btn {
  background-color: #ecedf0;
  padding: 1px 4px;
  border: none;
  border-radius: 4px;
  width: 25px;
}

.edit-control-action-icon {
  height: 8px !important;
}

.icons {
  display: flex;
  justify-content: end;
  padding: 4px;
  background: #fff;
  box-shadow: 0 3px 6px #00000029;
  width: fit-content;
  height: 30px;
  float: inline-end;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.move-item-modal .modal-content {
  min-height: fit-content !important;
}

.move-item-main {
  height: fit-content !important;
}

.alert-msg-sec {
  background-color: #fff3f3;
  border-left: 4px solid #D9534F;
  padding: 20px 5%;
  display: flex;
  align-items: center;
  gap: 16px;
  border-radius: 5px;
}

.alert-msg-sec .alert-icon {
  width: 18px !important;
}

.alert-msg-sec span {
  font-family: Lato-Bold;
  font-size: 15px;
  color: #D9534F;
}

.move-item-modal .save-cancel-div {
  padding: 24px 0 10px;
  text-align-last: end;
}

.move-item-modal .confirm-btn {
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: 1px solid #3d2557 !important;
  padding: 4px 10px;
  margin-right: 6px;
}

.move-item-modal .cancel-btn {
  border: 1px solid #483567;
  color: #483567;
  background-color: #fff;
  border-radius: 5px;
  padding: 4px 10px;
}

.root-cause-main {
  height: auto !important;
}


@media screen and (min-width: 768px) {
  .modal-dialog-custom-root-cause {
    max-width: 850px !important;
  }
}

@media screen and (max-width: 600px) {
  .modal-dialog-custom-root-cause {
    max-width: 100% !important;
  }
}

/* Add this to your CSS file */
.tooltip {
  position: relative;
  display: inline-block;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: max-content;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 5px;
  padding: 5px;
  position: absolute;
  z-index: 1;
  bottom: 100%;
  /* Position above the text */
  left: 50%;
  margin-left: -60px;
  opacity: 0;
  transition: opacity 0.3s;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

/* element.style {
  position: sticky;
  top: 0;
  z-index: 100;
} */

.yes-btn {
  background-color: #483567 !important;
  color: #fff !important;
}

.no-btn {
  background-color: white !important;
  border: 1px solid rgb(72, 53, 103) !important;
  color: rgb(72, 53, 103) !important;
  padding: 3px 30px !important;
  margin-top: 10px !important;

  text-align: center !important;
  font-family: Lato-Regular !important;
}




/* .css-3w2yfm-ValueContainer {
  align-items: center;
  display: flex;
  flex: 1;
  flex-wrap: nowrap; 
  overflow-x: auto !important; 
  overflow-y: hidden !important; 
  padding: 2px 8px;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch; 
  white-space: nowrap; 
  height: 40px; 
}  */

/* Additional styles for the labels to ensure they are fully visible */
/* .css-3w2yfm-ValueContainer .css-1hb7zxy-IndicatorsContainer {
  white-space: nowrap;
  overflow: scroll;
  
  max-width: 100%; /* Ensure it fits within the container
} */

.time-tracker-body .td {
  cursor: default;
}

/* header New Changes */
.main-header-admin.hide-logo .og-logo {
  display: none;
}

.main-header-admin.hide-logo .logo-onscroll {
  display: block;
  width: 100px !important;
  position: absolute;
  top: 20px;
}

.main-header-admin .logo-onscroll {
  display: none;
}

.menu-options {
  align-self: center;
  color: #eceaef;
}

.logo-box {
  padding: 5px 15px;
  /* padding-bottom: 10px; */
}

.custom-alignment {
  align-self: center;
}

.custom-bg-border {
  background-color: transparent !important;
  border: 1px solid #a6a6a6 !important;
}


.alert-dirty-msg-sec {
  background-color: #ffffff;
  padding: 20px 5%;
  display: flex;
  align-items: center;
  gap: 16px;
  border-radius: 5px;
}

.alert-dirty-msg-sec .alert-icon {
  width: 40px !important;
}

.alert-dirty-msg-sec span {
  font-family: Lato-Bold;
  font-size: 18px;
  color: gray;
  /* color: #c2aa0b; */
}

.custome-th-width {
  width: 40px;
}

@media screen and (max-width: 1199px) {
  .custome-th-width {
    width: 7%;
  }
}

@media screen and (max-width: 767px) {
  .custome-th-width {
    width: 5%;
  }
}


@media screen and (min-width: 1199px) {
  .custome-TaskId-width {
    width: 6%;
  }

  .custome-TaskName-width {
    width: 46%;
  }

  .custome-Estimated-width {
    width: 40px;
  }

  .custome-AssignedTo-width {
    width: 10%;
  }

  .custome-AssignedBy-width {
    width: 10%;
  }

  .custome-DueDate-width {
    width: 10%;
  }

  .custome-Status-width {
    width: 2%;
  }

  .custome-Delete-width {
    width: 2%;
  }
}


.ck-rounded-corners .ck.ck-editor__main>.ck-editor__editable,
.ck.ck-editor__main>.ck-editor__editable.ck-rounded-corners {
  padding-right: 24px;
}

@media screen and (max-width: 343px) {
  .editor-icon {
    height: calc(100% - 227px);
  }
}

@media screen and (min-width: 344px) and (max-width: 401px) {
  .editor-icon {
    height: calc(100% - 189px);
  }
}

@media screen and (min-width: 402px) and (max-width: 546px) {
  .editor-icon {
    height: calc(100% - 152px);
  }
}

@media screen and (min-width: 547px) and (max-width: 899px) {
  .editor-icon {
    height: calc(100% - 114px);
  }
}

@media screen and (min-width: 900px) and (max-width: 991px) {
  .editor-icon {
    height: calc(100% - 76px);
  }
}

@media screen and (min-width: 992px) and (max-width: 1337px) {
  .editor-icon {
    height: calc(100% - 114px);
  }
}

@media screen and (min-width: 1338px) {
  .editor-icon {
    height: calc(100% - 76px);
  }
}

.aggridtracker td:hover {
  border: none !important
}


.Tshirt .save-cancel-sec {
  /* padding: 24px 0 10px;
  text-align-last: center; */
  font-family: "Lato-Medium";
  text-align: right !important;
  margin-top: 15px;
  /* padding: 24px 0 10px; */
}



.Tshirt .save-btn {
  background-color: #483567;
  color: #fff;
  border-radius: 5px;
  border: 1px solid #483567;
  padding: 5px 8px;
  margin-right: 5px;
}

.Tshirt .cancel-btn {
  border: 1px solid #483567;
  color: #483567;
  background-color: #fff;
  border-radius: 5px;
  /* border: none; */
  padding: 4px 10px;
}


.deletedoc .modal-backdrop {
  height: 100% !important;
  width: 100% !important;
}

.Tshirt .innerBox {
  background-color: #f5f5f5;
  border: none !important;

}

.Tshirt table td {
  background-color: #fff;
  border-bottom: 5px solid #f5f5f5;
  height: 81px;
  position: relative;
}

.global-estimation .nav-item button {
  width: 130px !important;
}

.tab-content.global-estimation {
  min-height: calc(100vh - 120px);
  padding-bottom: 2rem;
}

@media screen and (max-width: 1439px) {
  .tab-content.global-estimation {
    min-height: calc(100vh - 6px);
  }

}


.login-page,
.link-expired-page {
  /* zoom: 1.111; */
  /* -moz-transform: scale(1.111, 1.111);/ */
  /* Moz-browsers */
  zoom: 1.111;
  /* Other non-webkit browsers */
  zoom: 111.1%;
  /* Webkit browsers */
}

@media screen and (max-width: 1439px) {

  .login-page,
  .link-expired-page {
    /* zoom: 1.111; */
    /* -moz-transform: scale(1.249, 1.249); */
    /* Moz-browsers */
    zoom: 1.249;
    /* Other non-webkit browsers */
    zoom: 124.9%;
    /* Webkit browsers */
  }
}

.category-width {
  width: 70% !important;
}

.searchIssue {
  width: 30%;

}

@media screen and (max-width: 1297px) {
  .searchIssue {
    width: 23%;
  }
}

.title-hover-sec:hover .custom-title {
  padding-right: 43px;

}

.title-hover-sec:hover {
  /* #ebecf0 */
  box-shadow: 0 0 0 1px #d8dae1;

}

.completed-sprints-custom {
  min-height: calc(100vh - 134px);
}

@media screen and (max-width: 1439px) {
  .completed-sprints-custom {
    min-height: calc(100vh - 16px);
  }
}

.floating-btn-sec {
  position: fixed;
  bottom: 56px;
  right: 68px;
  z-index: 9;
}

.floating-btn-mytask {
  position: fixed;
  top: 128px;
  right: 67px;
  z-index: 9;
}

.floating-btn-manageemployee {
  position: fixed;
  bottom: 56px;
  right: 25px;
  z-index: 9;
}

.floating-btn-myprojects {
  position: fixed;
  top: 123px;
  right: 25px;
  z-index: 9;
}

.floating-btn-addeditproject {
  position: fixed;
  bottom: 53px;
  right: 25px;
  z-index: 9;
}

.floating-btn-timetrack {
  position: fixed;
  top: 123px;
  right: 25px;
  z-index: 9;
}

.floating-btn-timelog {
  position: fixed;
  top: 123px;
  right: 25px;
  z-index: 9;
}

.floating-btn-profile {
  position: fixed;
  bottom: 53px;
  right: 25px;
  z-index: 9;
}

.floating-btn-rolepermission {
  position: fixed;
  bottom: 53px;
  right: 25px;
  z-index: 9;
}

@media screen and (max-width: 991px) {
  .floating-btn-myprojects {
    top: 178px;
  }

  .floating-btn-mytask,
  .refresh-btn-mytask {
    top: 178px !important;
  }

  .floating-btn-timetrack {
    top: 178px;
  }

  .floating-btn-timelog {
    top: 178px;
  }
}

/* .Edit-issue{
  zoom: 90%;
  -moz-transform: scale(0.9, 0.9);
  zoom: 0.9;
} */


.add-sub-item {
  position: absolute;
  left: -25px;
  top: 3px;
}

.add-sub-item img {
  width: 19px !important;
}

.history-main {
  width: 100%;
  max-height: 250px !important;
  overflow-y: auto;
  display: block !important;

}

.edit-previous {
  cursor: pointer;
  font-family: Lato-Regular;
  font-size: 14px;
  color: #000fdd;
  text-decoration: none;
  font-weight: 500;
}

.edit-previous:hover {
  cursor: pointer;
  color: #000bac;
  text-decoration: underline;
}

.linked-item .delete-linked-item {
  /* visibility: hidden; SYJ- commented for -> https://dev.edotpulse.edotteam.com/EditActionItem/IHMM-154*/
}

.linked-item:hover .delete-linked-item {
  visibility: visible;
}

.title-hover-sec {

  padding: 7px 5px 6px 5px;
  padding-right: 30px;
  box-shadow: 0 0 0 1px #d8dae1;
}


.container-fluid.Tshirt input {
  line-height: 38px;
}

.add-time-log.line-height-style input {
  line-height: 38px !important;
}

.line-height-style {
  line-height: 44px !important;
}

.custom-no-arrow {
  cursor: default !important;
}

.custom-no-arrow::after {
  display: none !important;
}

/* Ensure consistent padding for focused cells */
.timelog-table .ag-ltr .ag-cell-focus:not(.ag-cell-range-selected):focus-within:not(.custom-cell-class) {
  outline: none;
  padding-top: 6px !important;
  padding-left: 18px !important;
  border: none;
  /* background-color: rgba(0, 123, 255, 0.1); */
}


.custom-cell-class:focus-within {
  outline: auto !important;
  /* Reset outline */
  padding-top: 1px !important;
  padding-left: 18px !important;
  border: initial !important;
  /* Reset border */
  /* background-color: initial !important; */
  /* Reset background if needed */
}

.miscTask {
  padding-bottom: 0 !important;
  gap: 8px;
  border-bottom: 1px solid #B5A5C4;
}

.miscTask .project-tab {
  background-color: #B5A5C4;
  border: 1px solid #B5A5C4;
  border-bottom: none;
  border-top-left-radius: 7px;
  border-top-right-radius: 7px;
}

.miscTask .project-tab.Active {
  background-color: #ffffff !important;
  font-family: Lato-Bold !important;
  margin-bottom: -2px;
  border: 1px solid #B5A5C4;
  border-bottom: none;
}


.active-sprints-page {
  position: sticky;
  top: 139px;
  background-color: #fff;
  z-index: 99;
  padding-top: 5px !important;
}


/* SYJ Stying to handle on image click on agGrid in time Log */
.custom-ag-cell-noclick {
  /* pointer-events:  none; */
}

/* SYJ to static style to reduce ck editor height in My task modal */
.add-task-modal .ck.ck-editor__editable:not(.ck-focused) {
  min-height: 93px !important;
}

.add-task-modal .ck-editor__editable_inline:not(.ck-comment__input *) {
  height: 93px;
}

.card-draggable-custom-height {
  height: fit-content !important;
}

.goLiveDate .react-datepicker-wrapper,
.goLiveDate input {
  width: 100% !important;
}

.task-notification {
  position: absolute;
  /* top: 8px; */
  top: -3px;
  left: 57px;
  color: white;
  font-weight: bold;
  font-size: 12px;
  /* padding: 4px 8px; */
  border-radius: 50%;
  width: 21px;
  height: 21px;
  text-align: center;
  align-content: center;
  font-size: 11px;
}

@media screen and (max-width: 991px) {
  .task-notification {
    left: 50px;
  }
}

.hidden {
  display: none;
}

.work-item-modal .modal-content {
  min-height: fit-content !important;
  height: fit-content !important;

}

.work-item-modal .work-item-main {
  padding-block: 1.2rem 2rem !important;
  height: fit-content !important;
}

.work-item-modal .save-cancel-div {
  text-align-last: center;
}

.project-change-fbox {
  display: flex;
  align-items: end;
  justify-content: space-between;
}

no-history {
  text-align: center;
  font-weight: bold;
  padding: 10px;
}


@media screen and (min-width: 1200px) {
  .history-grid-modal {
    min-width: 1140px !important;
  }
}


.history-grid-modal .history-grid-sec .ag-header .ag-icon {
  color: #fff !important;
}

.history-icon {
  color: #535353;
  margin-top: 7px;
}

.refresh-btn-mytask {
  position: fixed;
  top: 128px;
  right: 25px;
  z-index: 9;
}

.crop-modal-area {
  height: 100% !important;
  width: 100% !important;
}

.crop-modal-area-main {
  width: 212px;
  background-color: #7f7f7f;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1000;
  height: 270px;
}

/*ST: 11/04/2025: Style checkboxes with a consistent blue color for all browsers*/
input[type="checkbox"] {
  accent-color: #007bff;
}

.custom-overview-modal {
  height: 60px !important;
  resize: none;
  width: 100%;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  font-weight: 400;
  padding: 0.375rem 0.75rem;
  appearance: none;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  line-height: 1.5;
  display: block;
}

.custom-overview-modal:focus {
  border: 1px solid #212529;
  /* thin light-black border */
  outline: none;
  /* removes default black outline */
  box-shadow: none;
  /* removes Bootstrap blue shadow */
}

/* https://edotpulse.com/EditActionItem/PULSE-1035, added margin to ag-grid class to remove white line issue on all resolutions*/
.ag-pinned-right-cols-container {
  margin-left: -2px;
}

.save-cancel-fixed {
  position: fixed;
  right: 32px;
  bottom: 45px;
  z-index: 9;
}

/* .my-200px-editor .rdw-editor-main {
  min-height: 200px !important;
  max-height: 200px !important;
  overflow-y: auto;
}

.fixed-height-editor {
  height: 200px;
  overflow-y: auto;
} */

/* Ensure the actual Draft editor grows to fill its parent */
/* .fixed-height-editor .rdw-editor-main,
.fixed-height-editor .rdw-editor-wrapper {
  height: 100% !important;
  min-height: 100% !important;
} */

/* If using editorClassName */
/* .small-textarea .rdw-editor-main {
  height: 200px !important;
  overflow-y: auto;
} */

/* Or if you wrapped it */
/* .small-textarea-wrapper .rdw-editor-main {
  height: 200px !important;
  overflow-y: auto;
} */

.my-fixed-editable .ck-editor__editable_inline {
  min-height: 220px !important;
  max-height: 220px !important;
  overflow-y: auto;
}

/*ST: Pulse-795: made start and end date on 1 line for readability */
@media screen and (min-width: 992px) {
  .end-date-center {
    text-align: center;
  }

  .end-date-right {
    text-align: right;
  }

}

.cursor-class {
  cursor: pointer;
}

/*SYJ- 04/06/2025 - Changes form blockquote Editor Full Screen*/
.editor-wrapper.fullscreen {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: white;
  z-index: 9999;
  padding: 20px;
  overflow: auto;
  display: flex;
  flex-direction: column;
}

.editor-wrapper.fullscreen .ck.ck-editor__main {
  height: 80vh !important;
  overflow: auto;
}

.editor-wrapper.fullscreen .ck-editor__editable {
  min-height: 80vh !important;
  overflow-y: auto;
}

.editor-wrapper.fullscreen .ck.ck-sticky-panel {
  position: sticky !important;
  top: 0 !important;
  z-index: 10001 !important;
  background-color: white;
  width: 100% !important;
}

.ck.ck-editor__top .ck-sticky-panel .ck-sticky-panel__content.ck-sticky-panel__content_sticky{  
  top: 0 !important;
  width: 100% !important;
}

.ck .ck-sticky-panel__placeholder{
  display: none !important;
}
.custom-class .css-1nmdiq5-menu {
    max-height: 150px !important;
    overflow: hidden;
}

.selected {
    border: 2px solid #007bff;
    background-color: #eaf3ff;
}

.custom-tooltip {
    background-color: #fff;
    color: black;
    padding: 10px 12px;
    max-width: 400px;
    white-space: normal;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}


/* My Tasks */
.settings-custom {
    /* padding-top: 1rem; */
    padding-bottom: 3rem;
}

    .settings-custom .collapsible-sec-pos {
        position: relative;
        background-color: #EBE6F5;
        padding: 5px 8px 5px;
        border-radius: 5px;
        box-shadow: 0 3px 6px #00000029;
    }

    .settings-custom .collapsible-sec-header {
        padding-left: 25px;
        background-color: #EBE6F5;
        padding-right: 8px;
        /* padding-block: 4px; */
    }

    .settings-custom .collapsible-sec-pos .collapsible-btn {
        border: none;
        border-radius: 3px;
        padding: 0 5px 0 4px;
        position: absolute;
        top: 10px;
        color: #fff;
        background-color: #483567;
        left: 9px;
        font-size: 10px;
    }

    .settings-custom .collapsible-sec-pos .active i {
        transform: rotate(90deg);
    }

    .settings-custom .collapsible-sec-pos .collapsible-header-text {
        font-size: 18px;
        font-family: Lato-Bold;
        color: #4E4E4E;
    }


    .settings-custom .collapsible-sec-pos .contentt {
        display: none;
    }

    .settings-custom .custom-grid-sec td {
        background-color: #ffffff;
        /* text-align: left; */
        padding: 5px 15px;
        border-bottom: 3px solid #EBE6F5;
        font-family: Lato-Medium;
    }

    .settings-custom .search-add-fbox {
        display: flex;
        justify-content: space-between;
    }

.pending-status {
    background-color: #85784E;
    color: #fff;
    font-size: 14px;
    padding: 2px 8px;
    border-radius: 3px;
}

.completed-status {
    background-color: #11A500;
    color: #fff;
    font-size: 14px;
    padding: 2px 8px;
    border-radius: 3px;
}

.settings-custom .task-id {
    color: #0011FF;
    text-decoration: underline;
}

.settings-custom .searchBar {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    background-color: #f5f5f5;
}

.settings-custom #searchQueryInput {
    width: 100%;
    height: 38px;
    outline: none;
    border: 1px solid rgb(72, 53, 103);
    border-radius: 5px;
    padding: 6px 10px;
    font-size: 13px;
}

.settings-custom #searchQuerySubmit {
    width: 2.5rem;
    height: 1.8rem;
    margin-left: -3.2rem;
    background: #ffffff;
    border: none;
    outline: none;
}

.settings-custom .add-task-sec {
    text-align: end;
}

.settings-custom .add-task-btn {
    background-color: #483567;
    color: #fff;
    border-radius: 5px;
    border: none;
    padding: 4px 10px;
}

/* Media Query */
@media screen and (min-width: 992px) {
    #manage-user .nav-margin {
        margin-right: 45px;
    }
}

@media screen and (min-width: 992px) and (max-width: 1199px) {
    .date-range-fbox span {
        font-family: Lato-Bold;
        font-size: 14px;
    }

    .date-range-fbox img {
        width: 16px;
    }
}

@media screen and (max-width: 767px) {
    .time-log .date-range-fbox {
        justify-content: space-around;
    }

    /* Add Employee  */
    .bubble-sec {
        margin-top: -8px;
    }
}

@media screen and (max-width: 991px) {

    /* Add Employee  */
    .flex-switch {
        display: flex;
        flex-direction: column-reverse;
    }
}

@media screen and (max-width: 576px) {

    /* Roles & Permissions  */
    .roles-permissions .save-cancel-sec {
        width: 50%;
        text-align: end;
    }

    .roles-permissions .section-title h6 {
        font-size: 15px;
    }

    .roles-permissions .save-btn,
    .roles-permissions .cancel-btn {
        padding: 4px 6px;
        font-size: 13px;
    }

    /* My Tasks */
    .search-add-fbox {
        flex-direction: column;
    }

    .settings-custom .searchBar {
        width: 100%;
    }
}

.filter-fbox {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: end;
}

.timesheet-custom {
    max-height: 400px;
    overflow-y: auto;
    display: block;
    width: 100%;
}