@import url("https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700;800&display=swap");
*{
	outline: 0!important;
}
:root{
	--primaryColor: rgb(47, 114, 183);
	--successColor: rgb(20, 200, 90);
}

/* Text */
html,body,div{
	font-family: "Nunito",arial,sans-serif;
}

/* Color */
.bg-primary{
	background-color: var(--primaryColor)!important;
}
.bg-success{
	background-color: var(--successColor)!important;
}

/* Logo */
.logo-xs{
	width: 80px;
}
.logo-sm{
	width: 120px;
}

/* Container */
.app-container{
	margin-top: 80px;
	margin-bottom: 80px;
}
.app-container.login{
	max-width: 350px;
}

/* Typo */
.text-primary{
	color: var(--primaryColor)!important;
}

/* Link */
a{
	text-decoration: none;
}
a:hover{
	text-decoration: underline;
}

/* Buttons */
.btn:focus,
.btn:active{
	box-shadow: none!important;
}
.btn-primary{
	background-color: var(--primaryColor);
	border-color: var(--primaryColor);
}
a.btn:hover{
	text-decoration: none;
}


/* Select */
.form-select{
	color:#333;
}
.form-select:focus,
.form-select:active{
	border-color: var(--primaryColor);
	outline: none!important;
	box-shadow: none!important;
}
option[value=""]{
	color: #999;
}
option{
	color: #333;
}

/* Alert */
.alert{
	position: fixed;
	left: 0;
	bottom: 0;
    z-index: 9999;
    width: 100%;
    margin: 0;
	padding: 1.2rem;
    border-radius: 0;
    border: 0;
	text-align: center;
	font-size: 1.1rem;
	font-weight: 600;
}

/* List of invoices */
#invoices-list .badge{
	top: 10px;
	left: 150px;
}

/* Modal */
.modal-container{
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: rgba(0 0 0/80%);
	z-index: 9999;
}
.modal-container.show{
	display: block;
	overflow: auto;
}
.modal-dialog-window{
    margin: 5em auto;
    width: 1680px;
    max-width: 100%;
    background-color: #fff;
    border-radius: 5px;
}
@media(max-width:1800px){
    .modal-dialog-window{
		width:90%;
    }
}
#invoice-modal{
	height: auto;
}
.modal-body{
	padding: 2rem;
}
.document-preview{
	width: 100%;
	height: 700px;
}
@media(max-width:992px){
	.document-preview{
		width: 100%;
		height: 400px;
		margin-bottom: 20px;
	}
}

/* Invoice and receipt for public */
.public-document-dock .document-preview{
	height: 750px;
}

/* Invoice history list */
#invoice-history{
	max-height: 500px;
	overflow-y: auto;
	position: relative;
}
#invoice-history .list-group-flush > .list-group-item{
	border-bottom: 0;
	margin-bottom: 3px;
}
#invoice-history .list-group .list-group-item{
	border-left-width: 3px;
	border-left-color: transparent;
}
#invoice-history .list-group .list-group-item.pending{
	border-left-color: rgb(255,193,7);
}
#invoice-history .list-group .list-group-item.sent{
	border-left-color: var(--successColor);
}

/* Mordern scrollbar */
.mordern-scroll{
	overflow-y: auto;
	max-height: 52vh;
}
.mordern-scroll::-webkit-scrollbar-track{
	border-radius: 6px;
	background-color: rgba(200,200,200,0.5);
	margin-right: 5px;
}
.mordern-scroll::-webkit-scrollbar{
  	width: 6px;
}
.mordern-scroll::-webkit-scrollbar-thumb{
	border-radius: 6px;
	background-color: var(--primaryColor);
}

/* Spinner */
img.spinner{
	display: none;
	z-index: 1;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 60px;
	transform: translate(-50%,-50%);
}

/* Footer */
footer > .container-fluid{
	background-color: rgba(255 255 255/80%);
    padding: 10px 1rem!important;
    text-align: center;
    font-size: .85rem;
}