:root {
  --main-bg-color: linear-gradient(
    135deg,
    rgba(71, 138, 126, 1) 40%,
    rgba(112, 89, 18, 1) 84%
  );
  --secondary-bg-color: linear-gradient(
    90deg,
    rgba(71, 138, 126, 1) 30%,
    rgba(173, 138, 28, 1) 84%
  );
  --btn-bg-dropdown-color: rgba(87, 154, 146, 0.2);
  --btn-bg-color: rgba(113, 187, 178, 0.2);
  --night-bg-color: #16404d;
}

.text-success {
  color: #68fdb9 !important;
}

.bg-custom-success {
  background-color: rgba(104, 253, 185, 0.25);
}

#chemicallogmodal input.form-check-input,
#addTransaction input.form-check-input,
#viewEditForm input.form-check-input,
#dispatchChemicalForm input.form-check-input {
  border: 1px solid #16404d !important;
  background-color: #bababa !important;
}
#chemicallogmodal input.form-check-input:checked,
#addTransaction input.form-check-input:checked,
#viewEditForm input.form-check-input:checked,
#dispatchChemicalForm input.form-check-input:checked {
  background-color: #2f855d !important;
}

* {
  box-sizing: border-box !important;
}

#inventorylogtable tr td,
#chemicalhistorylogtable tr td {
  color: #000 !important;
}

#chemicallogmodal .nav-tabs .nav-link {
  color: #7f7f7f !important;
}
#chemicallogmodal .nav-tabs .nav-link.active {
  color: #000 !important;
}

/* html,
body {
  min-height: 100vh;
  width: 100vw;
  height: 100%;
} */

.page-link {
  border: none !important;
}

#pagination nav ul li a,
#table2pagination nav ul li a,
#containerReportPagination nav ul li a {
  background: rgba(0, 0, 0, 0.25);
  color: #fff !important;
  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out,
    color 0.15s ease-in-out;
}

#pagination nav ul li a:hover,
#table2pagination nav ul li a:hover,
#containerReportPagination nav ul li a:hover {
  background-color: rgba(113, 187, 178, 0.3) !important;
  color: #fff !important;
}

.active > .page-link,
.page-link.active {
  border: none !important;
  background: rgba(113, 187, 178, 0.3) !important;
}

html,
body {
  margin: 0;
  padding: 0;
  min-height: 100vh !important;
  /* overflow-y: scroll; */
  background-repeat: no-repeat !important;
  background: #2c3e50;
  background: -webkit-linear-gradient(to right, #397681, #2c3e50);
  background: linear-gradient(to right, #397681, #2c3e50);
}

body {
  display: flex !important;
  /* flex-direction: column !important; */
}

.show-password {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* .eye-slash-pwd{
  float: right;
  right: 1rem;
  position: relative;
  top: -2.5rem;
  z-index: 2;
  cursor: pointer;
} */

.account-settings-icon {
  position: absolute !important;
  right: 1rem !important;
}

/* .sa-content {
  overflow: auto !important;
} */

.navbar-sticky {
  position: sticky !important;
  top: 0;
  z-index: 100 !important;
  backdrop-filter: blur(2px);
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.47);
  /* border-radius: 10px; */
  background-color: #ffffff;
}

::-webkit-scrollbar {
  width: 12px;
  background-color: #f5f5f5;
}

::-webkit-scrollbar-thumb {
  /* border-radius: 10px; */
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: #0d495b;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #146778;
}

.hstack .form-select option {
  color: black !important;
}

select:focus {
  border-color: #bababa !important;
}

.form-control-plaintext {
  border: none !important;
}

*:focus {
  box-shadow: none !important;
  outline: none !important;
}

input {
  box-shadow: none !important;
}

input:focus {
  border-color: #bababa !important;
}

/* .form-signin {
    max-width: 330px;
    padding: 1rem;
} */

.sa-sidebar {
  background-color: var(--secondary-bg-color);
  /* opacity: 75%; */
  z-index: 1;
}

.bg-dash {
  background: #2c3e50;
  background: -webkit-linear-gradient(to right, #397681, #2c3e50);
  background: linear-gradient(to right, #397681, #2c3e50);
}

.bg-official {
  background: #2c3e50;
  background: -webkit-linear-gradient(to right, #397681, #2c3e50);
  background: linear-gradient(to right, #397681, #2c3e50);
}

.img-round {
  border-radius: 1.2rem 1.2rem 0 0 !important;
}

.left-btn-rounded {
  border-radius: 0 0 0 1.2rem !important;
}

.right-btn-rounded {
  border-radius: 0 0 1.2rem 0 !important;
}

.card-bg {
  background: #6a9167;
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to bottom, #010211, #0d495b, #6a9167);
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to bottom, #010211, #0d495b, #6a9167);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  border-radius: 1.2rem !important;
}

.bg-official-login {
  background: rgb(227, 207, 147);
  background: -moz-linear-gradient(
    0deg,
    #e3cf93 0%,
    rgb(106, 145, 103) 11%,
    rgb(13, 73, 91) 58%,
    rgba(2, 21, 34, 1) 86%,
    rgb(1, 2, 17) 95%
  );
  background: -webkit-linear-gradient(
    0deg,
    rgba(227, 207, 147, 1) 0%,
    rgba(106, 145, 103, 1) 11%,
    rgba(13, 73, 91, 1) 58%,
    rgba(2, 21, 34, 1) 86%,
    rgba(1, 2, 17, 1) 95%
  );
  background: linear-gradient(
    0deg,
    rgba(227, 207, 147, 1) 0%,
    rgba(106, 145, 103, 1) 11%,
    rgba(13, 73, 91, 1) 58%,
    rgba(2, 21, 34, 1) 86%,
    rgba(1, 2, 17, 1) 95%
  );
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e3cf93", endColorstr="#010211", GradientType=1);
}

.bg-modal-title {
  background: #2c3e50; /* fallback for old browsers */
  background: -webkit-linear-gradient(
    to left,
    #4ca1af,
    #2c3e50
  ); /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(
    to left,
    #4ca1af,
    #2c3e50
  ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.text-light.bi.bi-x::before {
  transition: ease-in-out 0.1s !important;
}

.text-light.bi.bi-x:hover {
  color: #559264 !important;
}

.btn-grad {
  background-image: linear-gradient(
    to right,
    #134e5e 0%,
    #71b280 51%,
    #134e5e 100%
  );
}

.btn-grad {
  /* margin: 10px;
    padding: 15px 45px; */
  text-align: center;
  /* text-transform: uppercase; */
  transition: 0.5s;
  background-size: 200% auto;
  color: white;
  /* box-shadow: 0 0 20px #eee; */
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
  /* border-radius: 10px; */
  display: block;
}

.btn-grad:hover {
  background-position: right center;
  /* change the direction of the change here */
  color: #fff;
  text-decoration: none;
}

.fade {
  transition: opacity 0.2s ease-in-out !important;
}

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

  margin: 0;
}

.spinner-grow:nth-child(1) {
  animation-delay: 0s;
}

.spinner-grow:nth-child(2) {
  animation-delay: 0.1s;
}

.spinner-grow:nth-child(3) {
  animation-delay: 0.2s;
}

@keyframes spinner-grow {
  0% {
    transform: scale(0);
  }

  50% {
    opacity: 1;
    transform: none;
  }
}

input[type="number"] {
  -moz-appearance: textfield;
}

.bg-modal {
  background: rgb(227, 207, 147);
  background: -moz-linear-gradient(
    0deg,
    rgba(227, 207, 147, 1) 0%,
    rgba(106, 145, 103, 1) 11%,
    rgba(13, 73, 91, 1) 58%,
    rgba(2, 21, 34, 1) 86%,
    rgba(1, 2, 17, 1) 95%
  );
  background: -webkit-linear-gradient(
    0deg,
    rgba(227, 207, 147, 1) 0%,
    rgba(106, 145, 103, 1) 11%,
    rgba(13, 73, 91, 1) 58%,
    rgba(2, 21, 34, 1) 86%,
    rgba(1, 2, 17, 1) 95%
  );
  background: linear-gradient(
    0deg,
    rgba(227, 207, 147, 1) 0%,
    rgba(106, 145, 103, 1) 11%,
    rgba(13, 73, 91, 1) 58%,
    rgba(2, 21, 34, 1) 86%,
    rgba(1, 2, 17, 1) 95%
  );
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e3cf93", endColorstr="#010211", GradientType=1);
  /* opacity: 0.5; */
}

/* .modal-edit {
  backdrop-filter: blur(1px);
} */

.btn-login {
  background: rgba(255, 255, 255, 0.1);
}

.form-floating.form-custom > .form-control {
  background: transparent !important;
}

.form-floating.form-custom > label,
.form-floating.form-custom > input {
  color: #fff !important;
}

#searchbtn {
  width: 15% !important;
}

#searchbar {
  background: transparent !important;
  color: #fff;
}

#searchbar::placeholder,
#searchChemUsedSummary::placeholder,
#searchContainerStatus::placeholder {
  color: rgba(255, 255, 255, 0.6) !important;
}

.form-floating.form-custom > label::after {
  background-color: transparent !important;
  color: #fff !important;
}

.form-floating.form-custom input:-webkit-autofill,
.form-floating.form-custom input:-webkit-autofill:hover,
.form-floating.form-custom input:-webkit-autofill:focus,
.form-floating.form-custom input:-webkit-autofill:active {
  background-color: transparent !important;
  color: #fff !important;
  transition: background-color 5000s ease-in-out 0s !important;
  -webkit-text-fill-color: #fff !important;
}

form img {
  width: unset !important;
}

/* 
.sa-bg::before{
    filter: blur(100px);

} */

.btn-sidebar,
.btn-form-submit {
  transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out,
    color 0.3s ease-in-out;
}

.btn-form-submit:hover {
  background-color: rgba(113, 187, 178, 0.3) !important;
  color: #fff !important;
}

.btn-sidebar:hover,
.btn-active {
  background-color: var(--btn-bg-color) !important;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
}

.btn-active-dropdown,
.btn-active-dropdown:hover {
  background-color: var(--btn-bg-color) !important;
  box-shadow: 0px 2px 5px rgba(74, 74, 74, 0.2);
}

.acc-dropdown {
  align-items: unset !important;
  background-color: rgba(0, 0, 0, 0.4);
}

aside ul li a {
  display: flex !important;
  flex-direction: row !important;
}

.side-dropdown[aria-expanded="true"] .bi-chevron-compact-left::before,
.acc-dropdown-arrow[aria-expanded="true"] .bi-chevron-compact-left::before {
  transform: rotate(-90deg) !important;
}

.side-dropdown .bi-chevron-compact-left::before,
.acc-dropdown-arrow .bi-chevron-compact-left::before {
  transition: all 0.3s ease !important;
}

/* .side-dropdown.collapsed .bi-chevron-compact-left{
    transform: rotate(0deg) !important;


} */

aside ul li {
  margin: 0.2rem 0rem;
}

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

aside ul li a.btn {
  border-radius: unset !important;
}

.user-icon i::before {
  transition: box-shadow 0.3s ease-in-out, transform 0.3s ease-in-out !important;
  display: inline-block;
  padding: 10px;
  /* font-size: 2rem; */
  /* background-color: white; */
  border-radius: 50%;
}

.user-icon i:hover::before {
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2) !important;
  background-color: var(--btn-bg-color) !important;
  /* transform: scale(1) !important; */
}

table tr td,
table tr th {
  background-color: rgba(255, 255, 255, 0.2) !important;
  color: #fff !important;
}

table tr td button {
  color: #fff !important;
}

table.tech-table,
table.os-table {
  table-layout: fixed;
  width: 90%;
}

.tech-table,
.os-table {
  border-collapse: separate;
  border-spacing: 0;
  /* border-radius: 2rem; */
  overflow: hidden;
  margin: 1.5rem;
}

.tech-table thead tr:first-child th:first-child,
.os-table thead tr:first-child th:first-child {
  border-top-left-radius: 0.5rem;
}

.tech-table thead tr:first-child th:last-child,
.os-table thead tr:first-child th:last-child {
  border-top-right-radius: 0.5rem;
}

.tech-table tbody tr:last-child td:first-child,
.os-table tbody tr:last-child td:first-child {
  border-bottom-left-radius: 0.5rem;
}

.tech-table tbody tr:last-child td:last-child,
.os-table tbody tr:last-child td:last-child {
  border-bottom-right-radius: 0.5rem;
}

#activecontainer > .flatpickr-calendar.animate.inline {
  height: 90% !important;
  margin: auto auto;
}

.has-transaction {
  position: absolute;
  width: 3px;
  height: 3px;
  border-radius: 150px;
  bottom: 3px;
  left: calc(50% - 1.5px);
  content: " ";
  display: block;
  background: #3d8eb9;
}

.fc .fc-col-header-cell-cushion,
.fc .fc-daygrid-day-number {
  text-decoration: none !important;
  color: #fff !important;
}

.fc .fc-scroller-harness-liquid ::-webkit-scrollbar-track {
  /* -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); */
  background-color: #f5f5f5;
}

.fc .fc-scroller-harness-liquid ::-webkit-scrollbar {
  width: 12px;
  background-color: #f5f5f5;
}

.fc .fc-scroller-harness-liquid ::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: #9f9f9f;
}

.fc .fc-button-group > .fc-button,
.fc .fc-button-primary,
.fc .fc-button-primary:disabled,
.fc .fc-button-primary {
  background: #ffffff52;
  border: 1px solid white;
  border-radius: 0.6rem;
}

.fc .fc-button-primary:disabled {
  border: none !important;
}

.fc .fc-button-group > .fc-button:hover,
.fc .fc-button:not(:disabled):hover {
  background: #ffffff87;
  border: 1px solid white;
}

.fc .fc-toolbar.fc-header-toolbar {
  margin: 0.8rem 0;
}

.text-custom-success {
  color: #b3ffb2 !important;
}

.text-custom-danger {
  color: #e1737d !important;
}

.fc-event-title-container {
  padding: 0 0.25rem !important;
}

.fc-event-main {
  /* padding: 0 0.25rem !important; */
  display: flex !important;
  justify-content: center !important;
}

input.form-check-input {
  background-color: rgba(255, 255, 255, 0.5) !important;
  border: 1px white solid !important;
  width: 1.1rem !important;
  height: 1.1rem !important;
}