#scrollbar {
  height: calc(100vh - 91px);
  overflow-y: auto;
  scrollbar-width: thin;
}
#scrollbar::-webkit-scrollbar {
  width: 0;
}

.avatar-xs img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

i {
  vertical-align: middle;
  display: inline-block;
}

.alert-info {
  color: #1f75a4 !important;
  background-color: #dff0fa;
  border-color: #bfe1f4;
}
.alert-success {
  color: #088675 !important;
  background-color: #daf4f0;
  border-color: #b6e8e1;
}
.alert-warning {
  color: #b98a38 !important;
  background-color: #fef4e4;
  border-color: #fdeac9;
}
.alert-danger {
  color: #b44c36 !important;
  background-color: #fde8e4;
  border-color: #fbd1c8;
}

th {
  cursor: default;
  padding: 12px 14px 12px 10px;
}
.table .sort::before {
  top: 16px;
  right: 2px;
}
.table .sort::after {
  top: 10px;
  right: 2px;
}

.link-primary:hover {
  text-decoration: underline !important;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  background: transparent;
  bottom: 0;
  color: transparent;
  cursor: pointer;
  height: auto;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: auto;
}

.listjs-pagination li.active .page {
  cursor: default;
}

.subhead {
  display: inline-block;
  text-transform: lowercase;
}

.subhead::first-letter {
  text-transform: uppercase;
}

.bootstrap-select.show-tick .dropdown-menu li a span.text {
  max-width: 100%;
  word-wrap: break-word !important;
  white-space: normal;
  display: inline-block;
  inline-size: 27vw;
  overflow-wrap: break-word;
}

option[disabled] {
  color: gray;
}

option {
  color: black;
}

/* .dropdown-toggle::after {
    color: pink;
    background-color: #088675;
    z-index: 99;
}

.bootstrap-select .dropdown-toggle .filter-option {
    background-color: var(--vz-input-bg);
    border-radius: 0.25rem;
} */

/* 06-10-2023 */
.response-preview .row.choice {
  margin-bottom: 8px;
  align-items: center;
}
.response-preview .row.choice:last-child {
  margin-bottom: 0;
}
.response-preview .row.choice .add-option {
  margin-bottom: 0;
}
.response-preview .row.choice input[type="radio"] ~ .form-control:disabled,
.response-preview .row.choice input[type="checkbox"] ~ .form-control:disabled {
  border: transparent;
  background-color: transparent;
  padding: 2px 4px;
}
.view-role-table thead tr th label {
  margin-bottom: 0;
}
.text-align-items {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}
.ovservation-table-elements:first-child .arrow-action .shift-data-up {
  display: none;
}
.ovservation-table-elements:last-child .arrow-action .shift-data-down {
  display: none;
}
.close-btn {
  display: flex;
  align-items: center;
  justify-content: center;
}
#projectTable thead tr th,
#labourlog-table thead tr th,
#inspectionFormTable thead tr th,
#obasrvationFormTable thead tr th,
#orderTable thead tr th {
  padding-right: 20px;
}
#projectTable .sort::before,
#labourlog-table .sort::before,
#inspectionFormTable .sort::before,
#obasrvationFormTable .sort::before,
#orderTable .sort::before {
  top: 15px;
}
#projectTable .sort::after,
#labourlog-table .sort::after,
#inspectionFormTable .sort::after,
#obasrvationFormTable .sort::after,
#orderTable .sort::after {
  top: 9px;
}
.inspection-accordion.lefticon-accordion .accordion-button::after {
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
}
.select-custome.bootstrap-select .dropdown-menu {
  z-index: 1002;
}
/* 09-10-2023 */
.activity-modal .offcanvas-header {
  justify-content: flex-start;
  gap: 8px;
}
.activity-modal .offcanvas-header .btn-group {
  margin-left: auto;
}
.activity-modal .offcanvas-header .btn-light {
  padding: 0 6px;
}
.activity-modal .offcanvas-header h5 {
  margin-bottom: 0;
}
/* 10-10-2023 */
.loading-overlay {
  display: none;
  background: rgba(255, 255, 255, 0.5);
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  z-index: 9998;
  align-items: center;
  justify-content: center;
}
.loading-overlay.is-active {
  display: flex;
}
.spinner-border {
  display: block;
  position: fixed;
  top: calc(50% - (58px / 2));
  right: calc(50% - (58px / 2));
  color: #2FA926;
}
.modal .modal-body .btn-link.link-success {
  border: 1px solid #0ab39c;
}
.big .simplebar-content,
.big .simplebar-content .card,
.tall .simplebar-content,
.tall .simplebar-content .card {
  height: 100%;
}
/* 18-12/2023 */
.add-vitness-file .d-flex.p-2 {
  flex-wrap: wrap;
  gap: 8px;
}
.add-vitness-file h5 {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 250px;
}
.add-vitness-file .flex-shrink-0.ms-3 {
  margin: 0 !important;
}
.project-selector ~ .btn-light {
  background-color: #fff;
}
.apexcharts-canvas svg > text {
  font-size: 12px;
}
.list-inline.hstack {
  line-height: 16px;
}
.preview-card .bootstrap-select > .dropdown-toggle.bs-placeholder,
.preview-card .bootstrap-select > .dropdown-toggle.bs-placeholder:hover,
.preview-card .bootstrap-select > .dropdown-toggle.bs-placeholder:focus,
.preview-card .bootstrap-select > .dropdown-toggle.bs-placeholder:active {
  color: #000;
  opacity: 1;
}
.preview-card .form-control::placeholder {
  color: #000;
  opacity: 1;
}
.preview-card .btn.disabled,
.preview-card .btn:disabled,
.preview-card fieldset:disabled .btn {
  opacity: 1;
}

body .iti {
  display: block;
}

.chat-leftsidebar {
  height: calc(100vh - 92px);
}
body .daterangepicker .drp-calendar {
  max-width: 100%;
}

.logo {
  line-height: 30px;
}

:is([data-layout="vertical"], [data-layout="semibox"])[data-sidebar-size="sm"]
  .navbar-menu
  .simplebar-content-wrapper,
:is([data-layout="vertical"], [data-layout="semibox"])[data-sidebar-size="sm"]
  .navbar-menu
  .simplebar-mask {
  overflow: visible !important;
}

/* 15-10-2024 */
/* Sidebar */
[data-layout="vertical"][data-sidebar="dark"] .navbar-menu {
  background: #fff;
  border-right: none;
}
.navbar-brand-box {
  border-bottom: 1px solid #eeeeee;
}
[data-layout="vertical"][data-sidebar="dark"] .navbar-nav .nav-link,
[data-layout="vertical"][data-sidebar="dark"] .navbar-nav .nav-sm .nav-link {
  color: #17242a;
}
[data-layout="vertical"][data-sidebar="dark"] .navbar-nav .nav-link:hover,
[data-layout="vertical"][data-sidebar="dark"] .navbar-nav .nav-link:hover {
  color: #2FA926;
}
[data-layout="vertical"][data-sidebar="dark"]
  .navbar-nav
  .nav-link[data-bs-toggle="collapse"][aria-expanded="true"] {
    color: #17242a;
}
[data-layout="vertical"][data-sidebar="dark"]
  .navbar-nav
  .nav-sm
  .nav-link:hover {
    color: #2FA926;
}
[data-layout="vertical"][data-sidebar="dark"]
  .navbar-nav
  .nav-sm
  .nav-link:before {
    background-color: #2FA926 !important;
}
[data-layout="vertical"][data-sidebar="dark"]
  .navbar-nav
  > .nav-item
  .nav-link.active,
.navbar-nav > .nav-item .nav-link.active {
  background-color: #2FA926;
  color: #fff;
}
.navbar-menu .navbar-nav .nav-item {
  width: 100%;
}
.navbar-menu .navbar-nav .nav-link {
  padding: 12px 24px;
  font-size: 16px;
  line-height: 24px;
  gap: 12px;
}
.navbar-menu .navbar-nav .nav-link i {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
}
[data-layout="vertical"][data-sidebar="dark"][data-sidebar-size="sm"] .navbar-brand-box {
	background: #fff;
}
[data-layout="vertical"][data-sidebar-size="sm"] .navbar-menu .navbar-nav .nav-item:hover > a.menu-link {
	background-color: #2FA926;
  line-height: 0;
}
[data-layout="vertical"][data-sidebar-size="sm"] .logo.logo-light {
	display: block;
	padding: 15px 0;
}
/* Sidebar End */
/* Main */
body {
  background-color: #fff;
}
.text-grey-400 {
  color: #565656;
}
.text-grey-300 {
  color: #838383;
}
.solid-btn, .line-btn {
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #ffffff;
  background-color: #2FA926;
  border: 1px solid #2FA926;
  border-radius: 4px;
  padding: 6px 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: 0.3s ease-in-out;
}
.solid-btn:hover, .solid-btn:focus {
  color: #2FA926;
  background-color: #fff;
  border-color: #2FA926;
  transition: 0.3s ease-in-out;
  transform: none;
}
.solid-btn:disabled {
  border-color: #2FA926;
  background-color: #2FA926;
  color: #ffffff;
  pointer-events: none;
}
.line-btn {
  color: #2FA926;
  background-color: #fff;
}
.line-btn:hover, .line-btn:focus {
  color: #ffffff;
  background-color: #2FA926;
  border-color: #2FA926;
  transition: 0.3s ease-in-out;
  transform: none;
}
.line-btn:disabled {
  border-color: #2FA926;
  color: #2FA926;
  pointer-events: none;
}
.solid-btn i, .line-btn i {
  font-size: 20px;
  line-height: 24px;
}
.button-group {
  display: flex;
  align-items: center;
  gap: 18px;
}
.filter-btn-row {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
}
.icon-button {
	width: 22px;
	height: 22px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background-color: #2FA926;
	border-radius: 4px;
  padding: 0;
  transition: 0.2s ease-in-out;
}
.icon-button:hover, .icon-button:focus {
  color: #ffffff;
  transition: 0.2s ease-in-out;
  transform: none;
}
#page-topbar {
  background-color: #FFF7F2;
}
.topbar-user {
	background-color: transparent;
}
.topbar-user button:hover {
	transform: none;
}
.navbar-header .user-name-text {
	font-size: 14px;
	line-height: 20px;
}
.header-profile-user {
	height: 34px;
	width: 34px;
}
.dashboard-box-row {
  margin-bottom: -24px;
}
.dashboard-box-col {
  margin-bottom: 24px;
}
.dashboard-box-col a {
  display: block;
  height: 100%;
}
.card {
  box-shadow: none;
  border: none;
}
.card-body {
  padding-left: 0;
  padding-right: 0;
}
.card.card-dashboard {
  border: 1px solid #D3D3D3;
  border-radius: 12px;
  box-shadow: none;
  margin-bottom: 0;
  height: 100%;
}
.card-dashboard .card-body {
	display: flex;
	align-items: flex-start;
	gap: 18px;
	padding: 16px 20px;
}
.card-dashboard-icon i {
	width: 32px;
	height: 32px;
	font-size: 32px;
}
.dash-filter-picker ~ .input-group-text {
  color: #fff;
  background-color: #2FA926;
  border: 1px solid #2FA926;
}
.flatpickr-months {
  background-color: #fff7f2;
}
body .flatpickr-months .flatpickr-prev-month, body .flatpickr-months .flatpickr-next-month {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #17242A;
  fill: #17242A;
}
body .flatpickr-current-month .flatpickr-monthDropdown-months:hover {
  background: transparent;
}
body .numInputWrapper:hover {
  background: transparent;
}
.flatpickr-day.today {
  background-color: #2FA926;
}
body .flatpickr-day.today {
  border-color: #2FA926;
}
.flatpickr-day {
  color: #17242A;
}
body .flatpickr-day.selected, body .flatpickr-day.startRange, body .flatpickr-day.endRange, body .flatpickr-day.selected.inRange, body .flatpickr-day.startRange.inRange, body .flatpickr-day.endRange.inRange, body .flatpickr-day.selected:focus, body .flatpickr-day.startRange:focus, body .flatpickr-day.endRange:focus, body .flatpickr-day.selected:hover, body .flatpickr-day.startRange:hover, body .flatpickr-day.endRange:hover, body .flatpickr-day.selected.prevMonthDay, body .flatpickr-day.startRange.prevMonthDay, body .flatpickr-day.endRange.prevMonthDay, body .flatpickr-day.selected.nextMonthDay, body .flatpickr-day.startRange.nextMonthDay, body .flatpickr-day.endRange.nextMonthDay {
  background: #2FA926;
  border-color: #2FA926;
}
body .flatpickr-current-month input.cur-year, body .flatpickr-current-month .flatpickr-monthDropdown-months {
  font-size: 16px;
  line-height: 20px;
}
body .flatpickr-weekdays {
  background-color: transparent;
  color: #393939;
}
.page-title-box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	box-shadow: none;
	border-bottom: 1px solid #e9ebec;
}
.common-list {
	margin-bottom: 0;
  list-style: none;
  padding-left: 0;
}
.common-list li {
	position: relative;
	padding-left: 16px;
	margin-bottom: 12px;
}
.common-list li::marker {
  display: none;
}
.common-list li::before {
	content: "";
	position: absolute;
	top: 7px;
	left: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #2FA926;
}
.common-list li p {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: #17242A;
}
/* Table */
.table-card {
	margin: 24px 0 0;
}
.table .table-light, .table thead, .table tfoot {
	border-color: #EEEEEE;
	background-color: #eee;
}
.table th {
	background-color: transparent;
	border-bottom: none;
	padding: 0;
	box-shadow: none;
	line-height: 0;
  vertical-align: middle;
}
.table th a {
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  color: #565656;
	padding: 12px;
  display: block;
}
.table-card td:first-child, .table-card th:first-child {
	padding-left: 16px;
}
.table-card td:last-child, .table-card th:last-child {
	padding-right: 16px;
}
.table td {
	font-size: 14px;
	font-weight: 400;
	line-height: 18px;
	padding: 12px;
	color: #838383;
	vertical-align: middle;
	box-shadow: none;
}
.table-card td a i {
	font-size: 16px;
	line-height: 16px;
}
.table td a i::before {
	font-size: 16px;
  line-height: 16px;
}
.table tfoot td {
  padding-top: 8px;
  padding-bottom: 8px;
}
.table-card td:first-child a, .table-card th:first-child a {
	padding-left: 0;
}
.table-card td:last-child a, .table-card th:last-child a {
	padding-right: 0;
  text-align: center;
}
.table-card td:last-child p {
	justify-content: center;
}
.table td > a {
	display: inline-block;
}
.delete-modal i {
  margin-bottom: 12px;
  color: #FF0606;
	font-size: 44px;
	line-height: 44px;
}
/* Table End */
/* Switch Style */
.switch {
	position: relative;
	display: inline-block;
	width: 36px;
	height: 18px;
	margin: auto;
}
.switch input {
	opacity: 0;
	width: 0;
	height: 0;
}
input:checked + .slider {
	background-color: #2FA926;
}
.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	transition: .4s;
}
.slider {
	cursor: pointer;
}
.slider::before {
	position: absolute;
	content: "";
	height: 14px;
	width: 14px;
	left: 2px;
	bottom: 2px;
	background-color: white;
	transition: .4s;
}
.slider.round {
  border-radius: 34px;
}
.slider.round::before {
	border-radius: 50%;
}
input:checked + .slider::before {
	transform: translateX(18px);
}
/* Switch Style End */
/* Form Style */
.form-group {
  margin-bottom: 24px;
}
label, .form-label {
	font-size: 14px;
	font-weight: 400;
	line-height: 18px;
	color: #000000;
	margin-bottom: 8px;
	display: block;
}
label .text-danger, .form-label .text-danger {
	color: #FF0606 !important;
}
input[type="checkbox"] {
	width: 16px;
	height: 16px;
	border: 1px solid #CACACA;
	background-color: #ffffff;
	border-radius: 2px;
	margin: 0;
	padding: 0;
	cursor: pointer;
	flex-shrink: 0;
	transition: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
input[type="checkbox"]:checked {
	background-color: #2FA926;
	border: 1px solid #2FA926;
	background-image: url("../images/icon_check_box_right.svg");
	background-repeat: no-repeat;
	background-size: 12px;
	background-position: 1px 3px;
	transition: none;
}
/* Form Style End */
/* Loader Style */
#loader {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 1000;
  background: rgba(255, 255, 255, 0.8);
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}
.loader-spinner {
  width: 50px;
  height: 50px;
  border: 5px solid #f3f3f3;
  border-top: 5px solid #2FA926;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
/* Loader Style End */
/* Pagination */
.pagination {
  list-style: none;
  display: flex;
  justify-content: flex-end;
  padding-left: 0;
  margin: 0 16px 0 0;
  gap: 12px;
}
.pagination li {
  margin: 0;
}
.pagination li a {
  font-size: 14px;
  line-height: 20px;
  color: #565656;
  text-decoration: none;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  border-radius: 4px;
}
.pagination li a:hover, .pagination li a:focus {
  color: #2FA926;
}
.pagination li a.active {
  color: #fff;
  background-color: #2FA926;
}
.pagination li a.disabled {
  pointer-events: none;
  color: #6c757d;
}
.pagination li a i::before {
	font-size: 24px;
	width: 24px;
	height: 24px;
	line-height: inherit;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pagination li.inbetween {
  padding: 8px 12px;
  color: #6c757d;
}
.prev.disabled,
.next.disabled {
  opacity: 0.8;
  pointer-events: none;
}
.prev.disabled a,
.next.disabled a {
  color: #6c757d;
}
/* Pagination End */
/* General Setting */
.page-title-box-general {
  flex-wrap: wrap;
  gap: 12px;
}
.page-title-box-general .button-group {
  flex-wrap: wrap;
}
/* General Setting End */
/* Main End */

@media only screen and (max-width: 991px) {
  .solid-btn {
    padding: 6px 12px;
  }
  .button-group {
    gap: 12px;
  }
  /* Dashboard */
  .card-dashboard .card-body {
    gap: 10px;
    padding: 12px;
  }
  .card-dashboard-icon i {
    width: 26px;
    height: 26px;
    font-size: 26px;
  }
  /* Dashboard End */
}

@media only screen and (max-width: 575px) {
  .solid-btn {
    font-size: 14px;
    line-height: 20px;
  }
  .solid-btn i, .line-btn i {
    font-size: 14px;
    line-height: 20px;
  }
  .form-group {
    margin-bottom: 16px;
  }
  label, .form-label {
    margin-bottom: 6px;
  }
  .common-list li {
    margin-bottom: 8px;
  }
}