:root {
	--primary-color: limegreen;
	--primary-link-color: black;
	--primary-link-hover-color: #818181;
	--primary-color-hover: #17BE17;
	--primary-color-alt: #d33333; /* replaces #d33333 */
	--text-dark: #111; /* replaces #111 */
	--accent-color: #007bff; /* info icon */
}

.text-primary-color {
	color: #00DE00;
}

/* Typography */


html {
	font-size: 12px;
}

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

html {
	position: relative;
	min-height: 100%;
}

main {
	min-height: 88vh;
}

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

.link-text {
	color: var(--primary-link-color) !important;
	text-decoration: underline !important;
}

.link-text:hover {
	color: var(--primary-link-hover-color) !important;
	text-decoration: none !important;
}

.form-check-input:checked {
	background-color: var(--primary-color);
	border-color: var(--primary-color);
}

input[type="radio"] {
	accent-color: green !important;
}

a:link {
	text-decoration: none;
}

a:hover {
	color: var(--primary-color-hover);
}

.msg {
	color: var(--primary-color-alt)
}

/* Top Nav */

.t-navbar .navbar-nav li {
	padding: 8px 0px;
}

	.t-navbar .navbar-nav li.active {
		border-bottom: 2px solid var(--primary-color);
	}


/* page wrapper */

.page-wrapper {
	position: relative;
	transition: width 1s ease-in-out;
	width: calc(100% - 50px);
	height: 100vh;
}


/* Left Nav */

.l-navbar {
	width: 50px;
	position: relative;
	overflow: hidden;
	background-color: #f5f5f5;
	border: 1px solid #dee2e6;
}

	.l-navbar a {
		padding-left: 0.5rem;
	}

	.l-navbar .nl-sp {
		display: none;
	}

	.l-navbar .nl-i {
		width: 32px;
		font-size: 14px;
		text-align: center;
	}

.brand-t1, .brand-t2 {
	display: none;
}

@media (min-width: 768px) {
	.page-wrapper {
		width: calc(100% - 220px);
	}

	.l-navbar {
		width: 220px;
	}

		.l-navbar .nl-sp {
			display: inline;
		}

	.brand-t1, .brand-t2 {
		display: inline;
	}

	body.mini-navbar .l-navbar {
		width: 50px !important;
	}

	body.mini-navbar .page-wrapper {
		width: calc(100% - 50px) !important;
	}

	body.mini-navbar .l-navbar .nl-sp {
		display: none !important;
	}

	body.mini-navbar .brand-t1, body.mini-navbar .brand-t2 {
		display: none !important;
	}
}


/* l-navbar > brand; closer */

.brand {
	flex: 0 0 auto;
	display: block;
	font-size: 1.8rem;
	font-weight: 300;
	line-height: 1.2;
}

.brand-t1 {
}

.brand-t2 {
	color: var(--primary-color);
}

#sidebar-closer {
	position: absolute;
	top: 10px;
	right: 10px;
}


/* Right Nav */

.r-s-panel {
	position: absolute;
	visibility: hidden;
	overflow: hidden auto;
	inset: 0px 0px 0px auto;
	width: auto;
	left: 200px;
	background-color: rgb(255, 255, 255);
	box-shadow: rgb(0 0 0 / 22%) 0px 25.6px 57.6px 0px, rgb(0 0 0 / 18%) 0px 4.8px 14.4px 0px;
}
/*.r-s-panel a {
        color: #970707;
    }*/

/*.r-s-panel .form-check-input:checked {
        background-color: #970707;
        border-color: #970707;
    }*/

.r-s-panel-close {
	padding: 0px 0px 20px 14px;
	cursor: pointer;
}

@media (min-width: 576px) {
	.r-s-panel {
		left: 200px;
	}
}

@media (min-width: 768px) {
	.r-s-panel {
		left: 260px;
	}
}

@media (min-width: 992px) {
	.r-s-panel {
		left: 450px;
	}
}

@media (min-width: 1200px) {
	.r-s-panel {
		left: 650px;
	}
}

@media (min-width: 1400px) {
	.r-s-panel {
		left: 1100px;
	}
}


/* tabs */

.nav-tabs .nav-link {
	color: #111;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
	color: var(--primary-color);
}


/*  */

#addReportNote .reportlbl {
	display: inline-block;
	margin-bottom: 10px;
}


/* datatables */

.dataTables_wrapper {
	font-size: 12px;
}

	.dataTables_wrapper a {
		color: var(--primary-color);
	}

		.dataTables_wrapper a:hover {
			color: var(--primary-link-hover-color);
		}

	.dataTables_wrapper div.dataTables_filter input {
		width: 307px !important;
	}

	.dataTables_wrapper .row:first-child {
		margin-bottom: 5px;
	}

.dataTables_paginate .page-link {
	font-size: 12px;
}

.link-text {
	color: darkred;
	cursor: pointer;
}

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

table.dataTable td.dt-control:before {
	background-color: var(--primary-link-color) !important;
}

table.dataTable tr.dt-hasChild td.dt-control:before {
	background-color: var(--primary-link-hover-color) !important;
}

.dt-row {
	margin-bottom: 10px;
	min-height: 235px;
}

.dataTable tbody tr {
	height: 20px;
}

@media (min-width: 1200px) {
	.dataTable tbody tr {
		height: 25px;
	}
}

.dataTable tbody tr td {
	padding-right: 10px;
}

.loader {
	display: none;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}