/* #region Colors */

.color-hg {
	color: #7fd101 !important;
}

.background-color-hg {
	background-color: #7fd101 !important;
}

/* #endregion /Colors */

/* #region Borders */
.border-top-hg {
	border-top-color: #7fd101 !important;
}

.border-right-hg {
	border-right-color: #7fd101 !important;
}

.border-bottom-hg {
	border-bottom-color: #7fd101 !important
}

.border-left-hg {
	border-left-color: #7fd101 !important;
}

.border-thick-top-hg {
	border-top-width: 2px;
	border-top-color: #7fd101;
}

.border-thick-right-hg {
	border-right-width: 2px;
	border-right-color: #7fd101;
}

.border-thick-bottom-hg {
	border-bottom-width: 2px;
	border-bottom-color: #7fd101;
}

.border-thick-left-hg {
	border-left-width: 2px;
	border-left-color: #7fd101;
}
/* #endregion /Borders */

/* #region Cards */

/* #endregion /Cards */

/* #region Buttons */
.button-hg {
	background-color: #7fd101 !important;
	border-color: #7fd101 !important;
}

#hourglassProjects .btn-primary,
#hourglassProjectStatuses .btn-primary {
	background-color: #7fd101;
	border-color: #7fd101 !important;
}

#hourglassProjects .edit-btn:hover,
#hourglassProjectStatuses .edit-btn:hover {
	background-color: #c76932 !important;
	border-color: #c76932 !important;
}

#hourglassProjects .delete-btn:hover,
#hourglassProjectStatuses .delete-btn:hover {
	background-color: #cc4744 !important;
	border-color: #cc4744 !important;
}
/* #endregion /Buttons */

/* #region Icons */
.custom-underline-hg {
	display: inline-block; /* Important for border-bottom to work properly */
	border-bottom: 3px solid #7fd101 !important; /* Thicker, red underline */
	padding-bottom: 2px; /* Space between text and underline */
}
/* #endregion /Icons */

/* #region Forms */
/*#hourglassProjects input, #hourglassProjects textarea, #hourglassProjects select {
	-webkit-box-shadow: 1px 2px 9px -1px rgba(0,0,0,0.75);
	-moz-box-shadow: 1px 2px 9px -1px rgba(0,0,0,0.75);
	box-shadow: 1px 2px 9px -1px rgba(0,0,0,0.75);
}*/

/*#hourglassProjects select:hover {
	background-color: #7fd101 !important;
}*/

#hourglassProjects input:focus, #hourglassProjects textarea:focus, #hourglassProjects select:focus {
	outline: none !important;
	border-left-color: #202125 !important;
	border-top-color: #202125 !important;
	border-right-color: #202125 !important;
	border-bottom-color: #7fd101 !important;
/*	-webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
	-moz-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
	box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);*/
}

#hourglassProjectStatuses input:focus, #hourglassProjects textarea:focus, #hourglassProjects select:focus {
	outline: none !important;
	border-left-color: #202125 !important;
	border-top-color: #202125 !important;
	border-right-color: #202125 !important;
	border-bottom-color: #7fd101 !important;
	-webkit-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
	-moz-box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
	box-shadow: 4px 5px 9px -1px rgba(0,0,0,0.75);
}
/* Background color of calendar picker */
#hourglassProjects .picker--focused .picker__day--highlighted, .picker__day--highlighted {
	background-color: #7fd101 !important;
}
/* #endregion /Forms */

/* #region Select2 */
/*#hourglassProjects .select2-container .select2-dropdown {
	top: 100% !important;*/ /* Forces the dropdown to open downward */
	/*bottom: auto !important;
}*/

/* Remove the blue border on focus */
#hourglassProjects .select2-container--default .select2-selection--single .select2-selection__rendered {
	outline: none;
	border: none; /* Removes the border */
	box-shadow: none; /* Removes the shadow */
}

/* Remove the default focus border on the entire selection */
#hourglassProjects .select2-container--default .select2-selection--single {
	border-color: #202125 !important;
	box-shadow: none;
}

/* Green bottom border on focus */
#hourglassProjects .select2-container--default .select2-selection--single:focus {
	border-bottom-color: #7fd101 !important;
	box-shadow: none;
}

/* Background color when hovering over an option */
#hourglassProjects .select2-container--default .select2-results__option--highlighted {
	background-color: lightgray; /* Light grey for hover state */
	/*color: #000;*/ /* Black text */
}

/* Background color when an option is selected */
#hourglassProjects .select2-container--default .select2-results__option[aria-selected=true] {
	background-color: #7fd101;
	/*color: #000;*/ /* Black text */
}

/* Ensure no blue background appears when hovering off */
#hourglassProjects .select2-container--default .select2-results__option--highlighted[aria-selected=false] {
	background-color: #8e919d; /* Same as hover state */
	/*color: #000;*/
}

/* Clear any background color on hover off */
#hourglassProjects .select2-container--default .select2-results__option--highlighted:hover {
	background-color: #8e919d !important;
}
/* #endregion /Select2 */

/* #region Modals */
#hourglassProjects .modal-header {
	background-color: #7fd101;
}

#hourglassProjectStatuses .modal-header {
	background-color: #7fd101;
}
/* #endregion /Modals */

/* #region DataTable Lists */
/* #region DataTable Links */
.dt-link-hg {
	color: white;
}

.dt-link-hg:hover {
	color: #7fd101;
	text-decoration: underline;
}

#hourglassProjects .dt-email-link:hover,
#hourglassProjectStatuses .dt-email-link:hover {
	color: #7fd101;
}
/* #endregion /DataTable Links */
/* #endregion /DataTable Lists */

/* #region Specific DataTables */
/* #region Sticky Header */
#projectsScrollArea,
#projectStatusesScrollArea {
	height: 100%;
	max-height: 100%;
	overflow: auto;
	z-index: 998 !important;
}

#projectsScrollArea th,
#projectStatusesScrollArea th {
	position: sticky;
	top: 0px;
	background-color: #1d1e21;
	color: white;
	z-index: 999 !important;
}
/* #endregion /Sticky Header */

/* #region Search */
#projectsCustomSearchBox,
#projectStatusesCustomSearchBox {
	padding-left: 8px !important;
}

#projectsCustomSearchBox .dataTables_filter,
#projectStatusesCustomSearchBox .dataTables_filter {
	margin: 0 !important;
	padding: 0 !important;
}

#projectsCustomSearchBox .dataTables_filter input:focus,
#projectStatusesCustomSearchBox .dataTables_filter input:focus {
	box-shadow: none !important;
	border-bottom: 1px solid #7fd101 !important;
}
/* #endregion /Search */

/* #region DataTable Filters */
/* Keep dropdown icons highlighted as long as dropdown is shown */
#hourglassProjects .dropdown.show i.main-icon,
#hourglassProjectStatuses .dropdown.show i.main-icon {
	color: #7fd101;
}

#hourglassProjects .datatable-filters-wrapper i:hover,
#hourglassProjectStatuses .datatable-filters-wrapper i:hover {
	cursor: pointer;
	color: #7fd101;
}

#hourglassProjects #showDeletedButton[data-state="on"] i,
#hourglassProjectStatuses #showDeletedButton[data-state="on"] i {
	color: #cc4744 !important;
}

#hourglassProjects #showDeletedButton[data-state="off"] i,
#hourglassProjectStatuses #showDeletedButton[data-state="off"] i {
	color: white !important;
}

#hourglassProjects #showDeletedButton[data-state="off"] i:hover,
#hourglassProjectStatuses #showDeletedButton[data-state="off"] i:hover {
	color: #7fd101 !important;
}
/* #endregion /DataTable Filters */

/* #region DataTable Actions */
#hourglassProjects #dataTableActions .edit-btn,
#hourglassProjectStatuses #dataTableActions .edit-btn {
	background-color: #7fd101;
}

#hourglassProjects #dataTableActions .delete-btn,
#hourglassProjectStatuses #dataTableActions .delete-btn {
	background-color: #7fd101;
}
/* #endregion /DataTable Actions */

/* #region Length */
#projectsCustomTableLength .dataTables_length select:focus,
#projectStatusesCustomTableLength .dataTables_length select:focus {
	box-shadow: none !important;
	border-bottom: 1px solid #7fd101 !important;
}
/* #endregion /Length */

/* #region Export Buttons */
#projectsListCard .dt-button,
#projectStatusesListCard .dt-button {
	color: black !important;
	background-color: white !important;
	margin-left: 5px !important;
	border-radius: 7px !important;
	border: none !important;
	padding: 5px !important;
}

#projectsListCard .dt-button:hover,
#projectStatusesListCard .dt-button:hover {
	color: white !important;
	background-color: #7fd101 !important;
}
/* #endregion /Export Buttons */

/* #region Pagination */
#hourglassProjects .dataTables_paginate .paginate_button.current,
#hourglassProjectStatuses .dataTables_paginate .paginate_button.current {
	background-color: #7fd101 !important;
}
/* #endregion /Pagination */
/* #endregion /Specific DataTables */

/* #region Notifications */
.notification-item-hg:hover {
	background-color: rgba(127, 209, 1, 0.3);
	border-bottom: 1px solid #7fd101 !important;
}

.notification-hg {
	border-left: 5px solid #7fd101 !important;
	border-bottom: 1px solid gray !important;
}

.notification-hg:hover {
	border-left: 5px solid #7fd101 !important;
	border-bottom: none !important;
}

.dt-notification-hg {
	background-color: rgba(127, 209, 1, 0.3) !important;
	/*border-left: 5px solid #7fd101 !important;*/
	box-shadow: inset 5px 0 0 #7fd101; /* visual left stripe */
	border-bottom: 1px solid gray !important;
}

.dt-notification-hg:hover {
	border-bottom: 2px solid #7fd101 !important;
}
/* #endregion /Notifications */

/* #region Tooltips */
/* The .ui-tooltip class is declared in each cshtml view file */
/*.ui-tooltip {
	border-top: 2px solid #7fd101 !important;
	border-left: 2px solid #7fd101 !important;
	box-shadow: 2px 2px 5px #7fd101 !important;
	color: white;
	background-color: black;
}*/

.tooltip-icon-hg {
	color: white;
	cursor: pointer;
}

.tooltip-icon-hg:hover {
	color: #7fd101;
	cursor: pointer;
}

.tooltip-icon-hg:active {
	color: #7fd101;
	cursor: pointer;
}
/* #endregion /Tooltips */


/************************************************************************************************************************/

/* #region MEDIUM DEVICES */
/* md (medium devices, tablets): ≥ 768px*/
/* Styles for devices with a width of 768px and up */
@media (min-width: 768px) and (max-width: 1024px) and (hover: none) and (pointer: coarse) {

	/* #region Specific DataTables */
	/* #region Sticky Header */
	#projectStatusesScrollArea,
	#projectsScrollArea {
		height: 882px;
		max-height: 100%;
		overflow: auto;
	}
	/* #endregion /Sticky Header */
	/* #endregion /Specific DataTables */
}
/* #endregion /MEDIUM DEVICES */

/************************************************************************************************************************/

/* #region MOBILE DEVICES */
/* CSS for screens up to 767px width (typically mobile devices) */
@media only screen and (max-width: 767px) {
	/* #region DataTable Lists */
	/* #region DataTable Links */
	.dt-link-hg {
		color: white;
		text-decoration: underline;
	}
	/* #endregion /DataTable Links */
	/* #endregion /DataTable Lists */

	/* #region Specific DataTables */
	/* #region Search */
	#projectsCustomSearchBox,
	#projectStatusesCustomSearchBox {
		padding-right: 3px;
	}

	#projectsScrollArea,
	#projectStatusesScrollArea {
		max-height: 480px;
		overflow: auto;
	}
	/* #endregion /Search */

	/* #region DataTable Filters */
	#hourglassProjects #filterColumns.active,
	#hourglassProjects #mainIcon.active,
	#hourglassProjects #settings.active,
	#hourglassProjectStatuses #filterColumns.active,
	#hourglassProjectStatuses #mainIcon.active,
	#hourglassProjectStatuses #settings.active {
		color: #7fd101 !important;
	}

	#hourglassProjects #refreshButton i,
	#hourglassProjectStatuses #refreshButton i {
		color: white !important;
	}

	#hourglassProjects #showDeletedButton[data-state="on"] i,
	#hourglassProjectStatuses #showDeletedButton[data-state="on"] i {
		color: #cc4744 !important;
	}

	#hourglassProjects #showDeletedButton[data-state="off"] i,
	#hourglassProjectStatuses #showDeletedButton[data-state="off"] i {
		color: white !important;
	}

	#hourglassProjects #showDeletedButton[data-state="off"] i:hover,
	#hourglassProjectStatuses #showDeletedButton[data-state="off"] i:hover {
		color: white !important;
	}
	/* #endregion /DataTable Filters */
	/* #endregion /Specific DataTables */
}
/* #endregion /MOBILE DEVICES */