/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

/* wwwroot/css/site.css */
:root {
	--primary-color: #E52D12;
	--secondary-color: #F46100;
	--accent-color: #DCB95B;
	--highlight-color: #AB0046;
}

body {
	/*background-color: var(--accent-color);*/
	color: var(--primary-color);
}

.col-auto .text-body-emphasis .border-primary {
	color: var(--primary-color) !important;
}

.border-primary {
	border-color: var(--primary-color) !important;
}


.navbar .nav-link .nav-item, .navbar .navbar-brand {
	color: var(--primary-color) !important;
}

/*.navbar .nav-link:hover .nav-item:hover, .navbar .navbar-brand:hover {
	background-color: var(--primary-color) !important;
	color: white !important;
}*/

.page-link.active, .active > .page-link {
	background-color: var(--primary-color) !important;
	border-color: var(--secondary-color) !important;
}

.btn-primary {
	background-color: var(--primary-color);
	border-color: var(--secondary-color);
}

.btn-phoenix-primary {
	color: var(--secondary-color);
}

	.btn-phoenix-primary:hover {
		color: var(--secondary-color);
	}

/* Notification Dropdown Styles - Custom additions only */
/* Most styles (.notification-card:hover, .notification-card.unread, .avatar-name, .toast) are already in theme.css */

/* Avatar initials with orange text */
.avatar .avatar-name {
	color: var(--secondary-color, #F46100);
}

.notification-card {
	cursor: pointer;
}

.notification-card:last-child {
	border-bottom: none !important;
}

.notification-counter {
	font-size: 0.5rem;
	padding: 0.15rem 0.35rem;
	min-width: 1.2rem;
	text-align: center;
	line-height: 1;
	background-color: var(--secondary-color, #F46100) !important;
	border-radius: 999px !important;
}

#navbarDropdownNotification {
	margin-top: 2px;
}

#navbarDropdownNotification .notification-counter {
	position: absolute;
	top: -2px;
	right: -2px;
	transform: translate(25%, -25%);
}

.notification-toast {
	background-color: rgba(244, 97, 0, 0.92) !important; /* var(--secondary-color) #F46100 with opacity */
	border-color: var(--primary-color) !important;
	border-width: 1px !important;
	border-style: solid !important;
	opacity: 1 !important; /* Ensure opacity is applied */
}

#toast-container > div {
	padding: 0.5rem 0.75rem !important;
	margin: 0 0 0.5rem !important;
}

.btn-primary:hover {
	background-color: var(--highlight-color);
	border-color: var(--highlight-color);
}

.form-select {
	padding-bottom: 0px !important;
}

.form-label {
	color: var(--primary-color);
}

.nav-link-icon {
	color: var(--primary-color);
}

.even-row {
	background-color: #dcdcdc;
}

.odd-row {
	background-color: #ffffff;
}

.project-even-row {
	background-color: #f8f8ff;
}

.project-odd-row {
	background-color: #ffffff;
}

tr.table-row-clicked {
	background-color: rgba(0, 77, 255, 0.07) !important;
}

.form-control {
	/*border-color: var(--primary-color);*/
}

	.form-control:focus {
		border-color: var(--primary-color);
		box-shadow: 0 0 0 0.2rem rgba(171, 0, 70, 0.25);
	}

a {
	color: var(--secondary-color);
}

#loadingOverlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 1050; /* higher than most UI elements */
	pointer-events: auto;
}

.overlay-backdrop {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.4); /* dimmed background */
}

.overlay-spinner {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
	color: #fff;
	background-color: #1b6ec2;
	border-color: #1861ac;
}

/* Alerts
-------------------------------------------------- */
.alertBar {
  --phoenix-alert-padding-x: 10px;
  --phoenix-alert-padding-y: 10px;
  --phoenix-alert-margin-bottom: 1rem;
  --phoenix-alert-border: var(--phoenix-border-width) solid var(--phoenix-alert-border-color);
  position: relative;
  padding: var(--phoenix-alert-padding-y) var(--phoenix-alert-padding-x);
  margin-bottom: 0px;
  color: var(--phoenix-alert-color);
  background-color: var(--phoenix-alert-bg);
 }

/* Sticky footer styles
-------------------------------------------------- */
html {
	font-size: 14px;
}

@media (min-width: 768px) {
	html {
		font-size: 14px;
	}
}

.border-top {
	border-top: 1px solid #e5e5e5;
}

.border-bottom {
	border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
	box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
	font-size: 1rem;
	line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
	position: relative;
}
/*
body {
	background-color: #f9f9f9;
}*/

/*.footer {
    position: relative;
    bottom: 0px;
    width: 100%;
    white-space: nowrap;
    line-height: 60px;*/ /* Vertically center the text there */
/*}*/

.bg-black {
	background-color: black !important;
}

.card {
	/*background-color: #eee !important;*/
	/*border-radius: .2em;*/
	/*border: 1px solid #800000;*/
	margin-bottom: 3em;
	/*box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;*/
}

/*.card-body {
	padding-bottom: 0px;
}*/

h6 {
	font-weight: bold;
}

.card-footer {
	text-align: right;
}

a {
	text-decoration: none;
}

.site-nav-item:hover {
	background-color: #ddd;
}

.site-nav-item.active {
	background-color: #343a40;
}

	.site-nav-item.active .nav-link {
		color: white !important;
	}

		.site-nav-item.active .nav-link svg {
			color: white !important;
		}


.site-nav-item .nav-link svg {
	color: #800000;
}

.site-nav-item {
	text-overflow: ellipsis;
	overflow: hidden;
	text-wrap: none;
	white-space: nowrap;
	border-radius: .25rem;
	margin-right: 2px;
	padding-left: .5em;
	padding-right: .5em;
}

.navbar-brand {
	text-overflow: ellipsis;
	overflow: hidden;
	text-wrap: none;
	white-space: nowrap;
	text-align: left !important;
}

.text-ellipsized {
	text-overflow: ellipsis;
	overflow: hidden;
	text-wrap: none;
	white-space: nowrap;
}

.sidebar-action-item {
	padding: .5rem !important;
}

	.sidebar-action-item svg {
		color: #007bff !important;
		width: 24px !important;
	}

	.sidebar-action-item + .active svg {
		color: #fff !important;
		width: 24px !important;
	}

.text-super {
	vertical-align: super;
}

.error {
	color: red;
	font-size: small;
}

.text-strike-through {
	text-decoration: line-through;
}

hr {
	margin: .65em 0;
}

.text-primary {
	color: #800000 !important;
}

.sidebar-menu {
	display: flex;
	flex-direction: column;
	padding-left: 0;
	margin-bottom: 0;
}

	.sidebar-menu a {
		padding: 0.25rem 1rem;
		display: block;
		color: #212529;
		text-decoration: none;
		background-color: #fff;
		border-top: 1px solid rgba(0, 0, 0, 0.125);
		width: 100%;
		color: #495057;
		text-align: inherit;
	}

		.sidebar-menu a:last-child {
			border-bottom: 1px solid rgba(0, 0, 0, 0.125);
		}

		.sidebar-menu a:hover, .sidebar-menu a:focus {
			z-index: 1;
			color: #495057;
			text-decoration: none;
			background-color: #f8f9fa;
		}

		.sidebar-menu a.active {
			background-color: #e6dbb9;
			font-weight: bold;
		}

.card label {
	font-size: .9em;
	color: #6c757d !important;
}

.table-main-text {
	font-weight: 500;
}

.btn-outline {
	color: #500000;
	border-color: #500000;
}

	.btn-outline:hover {
		color: #fff;
		color: #500000;
		border-color: #500000;
	}

.tag:hover {
	color: #aeb7c4;
}

div.simpleTree-mainContainer.countHidden span.simpleTree-childCountBadge {
	display: none;
}

.simpleTree-highlight {
	background-color: greenyellow;
}

.simpleTree-nodeContainer {
	padding: .1rem 0;
	line-height: 1.15rem;
}

.simpleTree-indent {
	display: inline-block;
}

.simpleTree-toggle {
	display: inline-block;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
	padding-left: .5rem;
	cursor: pointer;
}

	.simpleTree-toggle:not(.disabled):hover {
		cursor: pointer;
		font-size: larger;
	}

	.simpleTree-toggle.disabled {
		color: gray;
		cursor: default !important;
	}

.simpleTree-label {
	display: inline-block;
	padding: .2rem .25rem;
	cursor: pointer;
	margin-left: .25rem;
	border: 1px solid transparent;
}

	.simpleTree-label:hover {
		font-weight: bold;
	}

.simpleTree-selected {
	border: 1px solid gray;
	background-color: whitesmoke;
	border-radius: .25rem;
	font-weight: bold;
}

.simpleTree-childCountBadge {
	margin-left: .5em;
	font-weight: normal;
	opacity: .75;
}

/* Attachment image styles
-------------------------------------------------- */
.attachment-thumbnail-img {
	width: 200px; /* Set a fixed width for the container */
	height: auto; /* Allow height to adjust based on aspect ratio */
	margin: 5px; /* Add margin for spacing */
}

	.attachment-thumbnail-img img {
		max-width: 100%; /* Ensure image does not exceed container width */
		height: auto; /* Allow height to adjust based on aspect ratio */
	}

.attachment-img {
}

/* Closable button inside the expanded image */
.closebtn {
	position: absolute;
	top: 10px;
	right: 15px;
	color: white;
	font-size: 35px;
	cursor: pointer;
}

/* Responsive utility classes for custom breakpoints
-------------------------------------------------- */
/* For screens up to 1600px (including 1521px) - use col-12 behavior */
@media (max-width: 1600px) {
	.col-responsive-8 {
		flex: 0 0 100%;
		max-width: 100%;
	}
}

/* For screens 1601px and above - use col-8 behavior */
@media (min-width: 1601px) {
	.col-responsive-8 {
		flex: 0 0 66.666667%;
		max-width: 66.666667%;
	}
}