@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css");
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;700&display=swap");
@import url('https://fonts.googleapis.com/css2?family=Shadows+Into+Light&display=swap');


.disabled-cursor {
  cursor: not-allowed !important;
   pointer-events: all !important;
}

.getAddress_autocomplete_list {
	border: 1px solid #ddd;
}

.getAddress_autocomplete_suggestion {
	padding-top:5px;
	padding-bottom:5px;
}

.fixedcol {
	position: sticky;
}

p {
	font-size:0.9rem !important;
}

a.link {
	font-size:0.9rem !important;
}

.dropdown-menu {
	font-size:0.9rem !important;
}

.btn, .btn-sm {
	font-size:0.8rem !important;
}

.sig1 {
	font-family: 'Shadows Into Light', cursive;
	font-size:1.2em;
}

.form-control:read-only {
    background-color: #f0f0f0; /* Light grey background */
    border: 1px solid #ccc; /* Grey border */
    color: #666; /* Dimmed text */
    cursor: not-allowed; /* Show not-allowed cursor */
}


.bg-danger-subtle {
	background:#F8D7DA !important;
}

.bg-success-subtle {
	background:#D1E7DD !important;
}

.form-control, .form-select, .input-group-text {
	font-size:0.9rem !important;
}

h5 {
	font-size:1.2em !important;
	margin-bottom:0rem !important;
	}

.selected {
    background-color: rgba(10,21,57,0.8) !important; 
	color:#fff !important;
}



#mainbar, .offcanvas {
	z-index:9999 !important;
}

#crmtabs {
	z-index:999 !important;
}

body {
	font-weight:500 !important;
	font-size:0.8rem !important;
}

#panelimg {
	width:100px;
	margin-bottom:50px;
}

:root {
	--darkblue: #0A1539;
	--lightblue: #009fe3;
	--white: #fff;
	--grey: #EAEFF5;
}

.topsection {
	height:80vh;
	overflow-y:scroll;
	padding-bottom:20px;
}

.topsection-sm {
	max-height:35vh;
	overflow-y:scroll;
}

.topsection-alt {
	height:85vh !important;
	overflow-y:scroll !important;
	margin-bottom:20px !important;
}

.bottomsection, .form-control, .form-select {
	font-size:0.8rem !important;
}

.bottomsection {
	height:100vh !important;
	overflow:scroll !important;
	margin-top:10px;
	font-size:0.8rem !important;
	padding-bottom:500px !important;
}

#subnav {
	width:12%;
}

#notifbody {
	opacity:0.8;
	transition: 0.8s;
	cursor:pointer;
}

.btn-secondary {
	color:#fff !important;
}

.active>.page-link {
	color:#fff !important;
}

.purp-grad {
	background: #8E2DE2;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #4A00E0, #8E2DE2);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #4A00E0, #8E2DE2); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	color:#fff;
	border:0px;
}

.pink-grad {
	background: #FF0099;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #493240, #FF0099);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #493240, #FF0099); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	color:#fff;
	border:0px;
}

.ns {
	color:#444 !important;
	font-weight:700 !important;
	text-decoration:none !important;
}

#notifbody:hover {
	opacity:1;
}

#notifcontent-sm {
	font-size:0.7rem !important;
}

.circleimg {
	border-radius:50% !important;
}

.form-switch .form-check-input:focus {
	border-color: rgba(0, 0, 0, 0.25);
	outline: 0;
	box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba(0,0,0,0.25)'/></svg>");
}

.form-switch .form-check-input:checked {
	background-color: #30D158;
	border-color: #30D158;
	border: none;
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba(255,255,255,1.0)'/></svg>");
}

.form-switch-red .form-check-input:focus {
	border-color: rgba(0, 0, 0, 0.25);
	outline: 0;
	box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba(0,0,0,0.25)'/></svg>");
}

#clientinfo {
	--bs-offcanvas-width:80% !important;
}

.form-switch-red .form-check-input:checked {
	background-color: #f30008;
	border-color: #f30008;
	border: none;
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba(255,255,255,1.0)'/></svg>");
}

.btn.disabled, .btn:disabled, fieldset:disabled .btn {
	border:0px;
}

textarea {
	font-size:0.9em;
}

.inperror {
	border:3px solid red;
	border-radius:0.375rem;
}

.bg-white {
	background-color: var(--white);	
}

.bg-main {
	background-color: var(--darkblue);
	height:100%;
	font-family: 'Manrope', sans-serif;
}

.bg-alt {
	background-color: var(--grey);
	height:100%;
	font-family: 'Manrope', sans-serif;
	font-weight:400;
}

.bg-lgreen {
	background-color:#D1E7DD;
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
	background-color: var(--darkblue) !important;
}


.nav-pills .nav-link {
	background-color: var(--grey) !important;
}

.bg-dblue {
	background-color: var(--darkblue) !important;
}

.popover-header{
    background-color: var(--darkblue) !important;
	color:#fff;
}

.text-dblue {
	color: var(--darkblue);
}

.bg-accent {
	background-color: var(--grey);
}

.bg-alt-light {
	background-color: var(--lightblue);
}

.thin {
	font-weight: 400 !important;
}

.thick {
	font-weight: 700 !important;
}

#CRMtable>tbody>tr:hover>* {
	background-color:#E2E6EC !important;
	color:#444;
	cursor:pointer !important;
}

.VC {
	background-color:#DC3545 !important;
	color:#fff;
}

.VCcheck:checked {
	background-color:#DC3545 !important;
	color:#fff;
	border:0px !important;
}

.Auditcheck:checked {
	background-color:#198754 !important;
	color:#fff;
	border:0px !important;
}

#CRMtable>tbody>tr.VC:hover>* {
	background-color:#DC3545 !important;
		color:#fff;
	cursor:pointer !important;
}

.nowrap {
    white-space: nowrap;
}

.active>.page-link {
	background-color: var(--darkblue);
	border:0px;
}

.section {
	background-color: var(--white);
}

.topbar {
	background-color: var(--darkblue);
	color: var(--white);
	height:70px;
}

.list-group-item {
	font-weight:700;
}

.text-sm {
	font-weight:300;
}

.sm-text {
	font-size:0.7rem !important;
}

.m-text {
	font-size:0.8rem !important;
}

.notiftitle {
	font-size:0.9rem !important;
}	

.notcontent {
	font-size:0.8rem !important;
}	

.list-group-flush>.list-group-item {
	font-weight:400 !important;
}

a.link, .list-group-item > a {
	color:#444 !important;
	text-decoration:none !important;
}

a {
	color:#444 !important;
	text-decoration:none;
}

a.attach {
	color: var(--lightblue);
}

#mainnav {
	font-weight:700 !important;
	
}

#loginform {
	background-color: var(--white);
	width:30%;
	margin-top:4%;
}

.btn-login, .btn-login:hover {
	background-color: var(--darkblue) !important;
	color:#fff !important;
}

.btn-alt, .btn-alt:hover {
	background-color: var(--lightblue) !important;
	color:#fff !important;
}

.btn-faded, .btn-faded:hover {
	background-color: var(--grey);
}

.notifmenu {
	width:500% !important;
}

.notheader {
	background-color: var(--darkblue);
	color:#fff;
	margin-top:-20px;
}

.ul {
	border-bottom:1px solid #ddd;
	padding-bottom:10px;
}

#notif {
	transition: 0.8s;
	background-color:#EAEFF5;
}

#notif:hover {
	cursor:pointer;
	color:#444;
}

#readmore {
		background-color: var(--grey);
		color:#444;
}

#doc {
	transition: 0.8s;
}

#doc:hover {
	background-color: var(--grey);
}

#notif:hover > #readmore {
		background-color: var(--darkblue);
		color:#fff;
}

.horizontal-shake {
  animation: bellshake 0.50s 5;
}

@keyframes bellshake {
  0%,
  100% {
    transform: rotate(0deg);
  }
  20%,
  60% {
    transform: rotate(6deg);
  }
  40%,
  80% {
    transform: rotate(-6deg);
  }
}

.tophalf {
	height:40vh;
	overflow-y:scroll;
}

.bottomhalf {
	height:60vh;
	overflow-y:scroll;
}

#multimenu {
	width:25%;
}

.bg-l-red {
	background-color:#F8D7DA;
}

.bg-l-red {
	background-color:#F8D7DA;
}

.bg-l-green {
	background-color:#D1E7DD;
}

@media (max-width: 991.98px) {
	

#multimenu {
	width:100%;
}
	
#loginform {
	background-color: var(--white);
	width:100%;
	margin-top:15%;
}

.notifmenu {
	width:500% !important;
}

.mobtab {
	width:25%;
}

}