@import url("bootstrap.min.css");
@import url("all.min.css"); /* Font Awesome 6.7 */
@import url("jquery.ladda.min.css");
@import url("bootstrap-modifications.css");
@import url("selectize.bootstrap3.css");
@import url("animate.css");
@import url("bootstrap-datepicker3.min.css");
@import url("nprogress.css");
@import url("summernote.css");
@import url("summernote-bs5.css");
@import url("premium-icons.css");

a.has-error {
	color:#a94442 !important;
}

.error-label {
	margin-left:5px;
}

form .alert {
	margin-bottom:0;
}

input::-ms-clear {
    display: none;
}
select::-ms-expand {
    width:12px;
    border:none;
    background:none;
}

.btn-file {
  position: relative;
  overflow: hidden;
}
.btn-file input[type=file] {
  position: absolute;
  top: 0;
  right: 0;
  min-width: 100%;
  min-height: 100%;
  font-size: 100px;
  text-align: right;
  filter: alpha(opacity=0);
  opacity: 0;
  background: red;
  cursor: inherit;
  display: block;
}

#pagination-nav {
	display:inline-block;
	margin-bottom:10px;
}
#pagination-nav li a {
	width:40px;
	text-align:center;
	padding-left:0;
	padding-right:0;
}
#pagination-nav ul {
	margin:0;
}
#pagination-nav small {
	color:#666;
	display:block;
}

.form-horizontal.labels-left .control-label {
	text-align:left;
}
.form-horizontal .form-group {
  margin-right: 0;
  margin-left: 0;
}
.form-group {
  margin-bottom: 0;
}
.form-group .form-control, .form-group .checkbox:last-child, .form-group .radio:last-child {
	margin-bottom:5px;
}
.form-group .input-group .form-control {
	margin-bottom:0;
}
.form-group .input-group {
	margin-bottom:5px;
}
label {
	font-weight:normal;
	color:#777;
}

/* Ensure text boxes are the same size */
input[type="text"],
textarea {
  width: 100%;
  box-sizing: border-box;
}

/* Prevent text overflow */
input[type="text"],
textarea {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; /* for single-line inputs */
}

/* For textareas specifically */
textarea {
  overflow: auto; /* allows scrolling if content is too long */
  white-space: normal; /* allows text wrapping */
  word-wrap: break-word;
  resize: vertical; /* only allow vertical resizing */
}

/* Make text shrink but not too small */
.responsive-text {
    font-size: clamp(10px, 2vw, 14px);  /* min-size, preferred-size, max-size */
}

.input-sm {
	font-size:14px;
	padding:2px 10px;
}
textarea {
	resize:vertical;
}
.row > .help-block {
	margin-left:5px;
	margin-right:5px;
}
.help-block.has-error{
	color: #a94442;
}
td .checkbox, th .checkbox {
	margin:0 0 0 20px;
}

td .selectize-input {
	height: 30px;
	padding: 4px 8px;
	min-height: 26px;
}

.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {
	  font-weight: 200;
}

.raty-star {
	color:rgb(255, 203, 5);
}
.raty-cancel {
	color:#999;
	opacity:0;
}

body {
	background: #f5f5f5;
   	padding: 0;
    height:100%;
    font-family:"Open Sans", sans-serif;
}

.main-content {
	margin-left:50px;
}

.navbar {
	border-width: 0 0 1px;
	border-radius:0;
	width:100%;
}

.container {
	width:90%;
}

a {
	color: #132C47;
}

.btn, input, .alert, .panel, select, .input-group-addon, textarea, .input-group-text {
	border-radius:0 !important;
	box-shadow: none !important;
}

.ladda-button {
 	-webkit-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all, .5s background-color ease-out !important;
	-moz-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all, .5s background-color ease-out !important;
	-ms-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all, .5s background-color ease-out !important;
	-o-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all, .5s background-color ease-out !important;
	transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all, .5s background-color ease-out !important;
}

@media (max-width: 1040px) {
.navbar-nav li a span {
 	 display: none;
}
}

.navbar-nav>li {
  float: left;
}

[data-toggle=buttons] .btn i.fas {
	opacity: 0;
}
[data-toggle=buttons] .btn.active i.fas {
	opacity: 1;
}

[data-bs-toggle=buttons] .btn i.fas {
	opacity: 0;
}
[data-bs-toggle=buttons] .btn.active i.fas {
	opacity: 1;
}

.navbar ul li a i.fas {
  color: black;
  line-height:0px;
  font-size: 24px;
  margin-right: 8px;
  vertical-align: middle;
}

/* Fixed overview boxes - equal height with text overflow prevention */
.overview-box {
	background-color: #fff;
	border: 1px solid #ddd;
	margin: 10px;
	text-align: center;
	height: 180px; /* Fixed height */
	display: flex;
	align-items: center;
	justify-content: center;
}

.overview-box:hover {
	background-color: #132C47;
	color: white;
}

.overview-box:hover a {
	color: white;
}

.overview-box a {
	text-decoration: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	color: #1D436C;
	padding: 20px;
	width: 100%;
	height: 100%;
}

.overview-box i {
	font-size: 38.5px;
	margin-bottom: 0.5em;
	display: block;
	flex-shrink: 0;
}

.overview-box span {
	font-size: 24.5px;
	display: block;
	word-wrap: break-word;
	overflow-wrap: break-word;
	hyphens: auto;
	line-height: 1.2;
	max-width: 100%;
}

.overview-box .modal-overview-box{
	text-decoration: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	color: #1D436C;
	padding: 20px;
	width: 100%;
	height: 100%;
}

.overview-box .modal-overview-box,
.overview-box .modal-overview-box i,
.overview-box .modal-overview-box span {
    color: #1D436C !important;
}

.overview-box .modal-overview-box:hover i,
.overview-box .modal-overview-box:hover span {
	color: white !important;
}


h1 {
	font-weight: normal;
  	color: #1D436C;
  	margin-top:0;
}




#main-navi{
	z-index: 11;
	position: fixed;
	top:0px;
	left:0px;
    height:100%;

	width:50px;

	background-color: #fff;
    overflow: hidden;

/* 	-webkit-box-shadow: inset -10px 0px 20px -10px rgba(0, 0, 0, 0.3);
	box-shadow: inset -10px 0px 20px -10px rgba(0, 0, 0, 0.3); */

	border-right:1px solid #ddd;

	transition: width 0.5s;
}
#main-navi:hover {
	width:180px;
}

#main-navi ul {
	list-style-type:none;
	margin:0;
	padding:0;
}
#main-navi li {
	margin:0;
	padding:0;
}
#main-navi.menu-development{
    background-color: #1A4D11;
}
#main-navi .fas {
	 font-size: 22px;
	 position: absolute;
	 top:14px;
	 width:48px;
	 display:block;
	 text-align: center;
}

#main-navi li img {
	position:absolute;
	border-radius:50%;
	left:11px;
	width:28px;
	top:11px;
}
#main-navi .icon-container .badge-icon {
	position:absolute;
	top:1px;
	left:21px;
	color:#f89406;
	font-size:.5em;
}

#main-navi .icon-container{
	margin-top: -3px;
}
#main-navi .icon-container img.employee{
	margin-left: 3px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
}

#main-navi .modulename {
	position: absolute;
	height:32px;
  	display: table;
	top: 9px;
	left: 49px;
	width:120px;
	line-height: 16px;
	padding-top:8px;
	opacity:0;
	transition:opacity .5s;
}
#main-navi:hover .modulename {
	opacity:1;
}

#main-navi {
	line-height:0;
}

a.navi-module-link {
	position: relative;
	display: inline-block;
	width:100%;
	height:50px;
    font-size: 12px;
	color: #1D436C;
    text-decoration: none;
    background-color:white;
}

a.navi-module-link .fas{
	color: #1D436C;
}

a.navi-module-link.active .fas, a.navi-module-link:hover .fas{
	color: #fff;
}

a.navi-module-link.new_items {
	border-left:4px solid #f89406;
	width:176px;
}
a.navi-module-link:hover, a.navi-module-link.active{
    background-color: #1D436C;
    color:#fff;
}
a.navi-module-link.employee{
	height:52px;
	/* background: #132C47; */

	border-bottom: 1px solid #cdcdcd;
	cursor: pointer;
}

a.navi-module-link.employee {}

a.navi-module-link.employee {}
.accordionContent{
	display: none;
	width:180px;
}
.accordionContent a.navi-module-link{
	background: #222;
}
.accordionContent a.navi-module-link.logout{
	background: #cd4b53;
}
.accordionContent a.navi-module-link.logout:hover{
	background: #d95e66;
}
.accordionContent a.navi-module-link:hover{
    background-color: #444;
    color:#ddd;
}
a#toggle_menu{
    /* background-color: #222; */
    color: #fff;
    /* border-top:1px solid #555; */
    /* border-bottom:1px solid #555; */
}

a.navi-module-link .active-module-caret{
	display:none;
	position: absolute;
	right: 0px;
	top: 15px;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 10px 10px 10px 0;
	border-color: transparent white transparent transparent;
}
a.navi-module-link.active .active-module-caret{
	/* display:block; */
}

.big-branding{
	position: absolute;
	bottom:15px;
	z-index:-1;
	transition:opacity .5s;
	opacity:0;
}
.logo-small{
	opacity:1;
	width: 40px;
	margin-left:5px;
	transition:opacity .5s;
}
.logo-big{
	width: 150px;
	opacity:1;
	margin-left:15px;
}
#main-navi:hover .big-branding {
	opacity:1;
}
#main-navi:hover .logo-small {
	opacity:0;
}
.big-branding.open{
	margin-left: 0px;
}

.pagination>li>a, .nav-tabs>li>a {
	border-radius: 0 !important;
}

/*Fancy Header and stuff*/

#page-button-group {
	float: right;
	clear: both;
}

#page-info-group {
	float: right;
	clear: both;
	margin-top: 10px;
}

#page-info-group table{
	font-size: 12px;
	color: #999;
	display: inline-block;
	margin-left: 15px;
}

#page-info-group table td{
	padding: 0 3px;
}

#page-info-group table td:nth-child(2){
	color: #222;
}

.button-group{
	text-align: right;
	margin-bottom: 5px;
	float: right;
}

.button-group .btn{
	margin-left: 3px;
}

.tab-navigation-wrapper{
	border-bottom: 5px solid #1D436C;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-right: 350px;
}

.nav-tabs {
	margin: 0;
}

.nav-tabs.bordered {
	padding-bottom: 1px;
}

[hidden="hidden"]{
	display: none !important;
}

.modal-dialog.modal-xl{
	width: 90% !important;
	max-width: 90% !important;
}

/*White card*/

.white-card {
	background-color: #fff;
	padding: 10px;
	border:1px solid #eee;
 	-webkit-box-shadow: 0px 1px 3px -1px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 1px 3px -1px rgba(0,0,0,0.2);
	box-shadow: 0px 1px 3px -1px rgba(0,0,0,0.2);
	margin-bottom: 10px;
	position: relative;
	overflow: visible;
}

.white-card h5 {
	margin-top: 0px !important;
	margin-bottom: 5px !important;
	display: inline-block !important;
	color: #1D436C !important;
	font-weight: bold !important;
	font-size: 14px !important;
}

.white-card .white-card-head {
	position: relative;
}

.white-card .button-group{

}

.white-card-header{

}


/*Table form*/
.table-form {
	width: 100%;
}

.table-form th{
	font-weight: normal;
}

.table-form tr td:FIRST-CHILD {
	color: #999;
	white-space: nowrap;
}

.table-form tr td {
	padding-right: 3px;
	padding-left: 2px;
	padding-top: 1px;
	padding-bottom: 1px;
}

.table-form textarea {
	margin-bottom: 0px;
}

.table-form input[type="text"],
.table-form input[type="email"],
.table-form textarea, .table-form select {
	width: 100%;
	box-sizing: border-box;
	height: 30px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing: border-box;
    font-size: 14px !important;
}

.table-form td input{
	display: inline-block;
}

.inline-form-controls input {
	display: inline-block;
}

.table-form .inline-checkbox{
	margin-left: 20px;
	cursor: pointer;
	font-weight: normal;
}

.table-form .inline-checkbox *{
	cursor: pointer;
}

.table.no-border, .table.no-border td, .table.no-border th, .table.no-border tr{
	border: 0px;
}

.nav-tabs>li.disabled>a:hover {
	border: 1px solid transparent
}

/*Table sorting*/
table thead th.sort {
	position: relative;
	padding-right: 20px;
	cursor: pointer;
}
table thead th.sort:after {
	position:absolute;
	font-family: FontAwesome;
	right: 10px;
	content: "\F0DC";
	color: #CCC;
}
table thead th.sort-order-ASC:after {
	content: "\F0DE";
	color: #132C47;
}
table thead th.sort-order-DESC:after {
	content: "\F0DD";
	color: #132C47;
}

.uneditable-input {
	display: block;
	width: 100%;
	padding: 4px 10px;
	font-size: 14px;
	line-height: 1.42857143;
	color: #555;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
}

/* halp me lawd */
.input-sm.selectize-control {
	height: 30px;
}
.input-sm.selectize-control .selectize-input {
	min-height: 30px;
	height: 30px;
	padding: 4px 12px;
}

/* Rowlink */
.table.rowlink td:not(.rowlink-skip),
.table .rowlink td:not(.rowlink-skip) {
  cursor: pointer;
}
.table.rowlink td:not(.rowlink-skip) a,
.table .rowlink td:not(.rowlink-skip) a {
  color: inherit;
  font: inherit;
  text-decoration: inherit;
}
.table-hover.rowlink tr:hover td,
.table-hover .rowlink tr:hover td {
  background-color: #efefef;
}

.form-horizontal .checkbox, .form-horizontal .checkbox-inline, .form-horizontal .radio, .form-horizontal .radio-inline{
	padding-top: 0px;
}

body.application-type-qa {
	padding-bottom: 140px;
	border-top: 20px solid #e8ec36;
}

#qa-banner {
	position: fixed;
	font-size: 100px;
	right: 0px;
	overflow: auto;
	bottom: 0;
	z-index: -1;
	color: #999;
	width: 100%;
	border-bottom: 20px solid #e8ec36;
	text-align: right;
	padding-right: 10px;
}

body.application-type-qa #main-navi {
	background-image: -webkit-linear-gradient(45deg,rgba(0,0,0,.15) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.15) 50%,rgba(0,0,0,.15) 75%,transparent 75%,transparent);
	background-image: -o-linear-gradient(45deg,rgba(0,0,0,.15) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.15) 50%,rgba(0,0,0,.15) 75%,transparent 75%,transparent);
	background-image: linear-gradient(45deg,rgba(0,0,0,.15) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.15) 50%,rgba(0,0,0,.15) 75%,transparent 75%,transparent);
	-webkit-background-size: 40px 40px;
	background-size: 40px 40px;
	background-color: #e8ec36;
}

body.application-type-qa #main-navi a.navi-module-link {
	background: rgba(255,255,255,0.5);
}

body.application-type-qa #main-navi a.navi-module-link.active, body.application-type-qa #main-navi a.navi-module-link:hover {
	background: rgba(29,67,108,0.5);
}

.selectize-control.multi .selectize-input > div {
	padding-top: 0;
	padding-bottom: 0;
}

#local-banner {
	position: fixed;
	font-size: 100px;
	right: 0px;
	overflow: auto;
	bottom: 0;
	z-index: -1;
	color: #999;
	width: 100%;
	border-bottom: 20px solid #e34242;
	text-align: right;
	padding-right: 10px;
}

body.application-type-qa #main-navi {
	background-image: -webkit-linear-gradient(45deg,rgba(0,0,0,.15) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.15) 50%,rgba(0,0,0,.15) 75%,transparent 75%,transparent);
	background-image: -o-linear-gradient(45deg,rgba(0,0,0,.15) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.15) 50%,rgba(0,0,0,.15) 75%,transparent 75%,transparent);
	background-image: linear-gradient(45deg,rgba(0,0,0,.15) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.15) 50%,rgba(0,0,0,.15) 75%,transparent 75%,transparent);
	-webkit-background-size: 40px 40px;
	background-size: 40px 40px;
	background-color: #e34242;
}

body.application-type-qa #main-navi a.navi-module-link {
	background: rgba(255,255,255,0.5);
}

body.application-type-qa #main-navi a.navi-module-link.active, body.application-type-qa #main-navi a.navi-module-link:hover {
	background: rgba(29,67,108,0.5);
}

.selectize-control.multi .selectize-input > div {
	padding-top: 0;
	padding-bottom: 0;
}



/* Manually change JQuery Raty to use FontAwesome icons instead of images */

.raty i.fa-star {
    color: #ffc107;
}

.raty i.fa-star-regular {
    color: #e4e5e9;
}

/* Newly added */

:root, body {
    font-size: 14px !important;
}

.form-control, .btn, .input-group-text, .nav-link, .table, .dropdown-item {
    font-size: 14px !important;
}

input[readonly],
textarea[readonly] {
  background-color: #eee;
  cursor: not-allowed;
}

input[readonly]:focus,
textarea[readonly]:focus {
  background-color: #eee !important;
  box-shadow: none;
  border-color: #ccc;
}

/* Styling Navigation Tabs like in Bootstrap 3 */

.nav-link{
    color: #1d334a !important;
}

.navbar{
    margin-bottom: 20px !important;
}

.btn-primary{
    background-color: #337ab7 !important;
}

.pagination .active a,
.pagination .active {
    background-color: #337ab7 !important;
    border-color: #2e6da4 !important;
    color: #fff !important;
}

/* Styling Headers like in Bootstrap 3 */

h1, h2, h3, h4, h5, h6 {
  margin-top: 20px;
  margin-bottom: 10px;
  font-weight: 500;
  line-height: 1.1;
}

h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small {
  font-weight: normal;
  line-height: 1;
  color: #777;
  font-size: 65%;
}

/* Override Bootstrap 5 .btn-secondary to look like Bootstrap 3 .btn-default */
.btn.btn-secondary {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}

.btn.btn-secondary:hover,
.btn.btn-secondary:focus,
.btn.btn-secondary:active,
.btn.btn-secondary.active,
.open > .dropdown-toggle.btn-secondary {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}

.btn.btn-secondary:active,
.btn.btn-secondary.active {
  background-image: none;
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.btn.btn-secondary:focus {
  outline: none;
  box-shadow: 0 0 0 0.2rem rgba(0, 0, 0, 0.1); /* optional */
}


/*
* Restoring Bootstrap 3 Design to Radio/Checkboxes
*/

input.form-check-input[type="radio"] {
  -webkit-appearance: radio !important;
  -moz-appearance: radio !important;
  appearance: radio !important;
  border-radius: 50% !important;
  width: auto !important;
  height: auto !important;
  background-image: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
  vertical-align: middle;
}

/*
* Remvoe Arrows from number inputs
*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type=number] {
  -moz-appearance: textfield;
}

/* Align font sizes responsively */
.responsive-text{
    font-size: clamp(10px, 2vw, 14px);
}