/* ---- Modern theme baseline (BS5 variable overrides) ---- */
	:root{
		--bs-body-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
		--bs-border-radius: 0.5rem;
		--bs-border-radius-sm: 0.375rem;
		--bs-border-radius-lg: 0.75rem;
		--bs-border-radius-xl: 1rem;
	}

	html,body{
		min-height: 100%;
		font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
		background: #f3f4f7;
	}

	.main-navbar .nav-link{
		color: #fff!important;
	}
	.main-navbar{
		box-shadow: 0 1px 3px rgba(0,0,0,0.12);
	}
	.content-wrapper {
		margin: 24px;
		border-radius: 14px;
		background: #fff;
		font-size: 0.9em;
		box-shadow: 0 1px 2px rgba(16,24,40,0.06), 0 4px 12px rgba(16,24,40,0.06);
		border: 1px solid rgba(16,24,40,0.04);
	}

	.content {
		padding: 24px;
	}
	.titlebar {
		border-bottom: 1px solid rgba(16,24,40,0.08);
		padding: 0.85rem 1.5rem;
	}
	.titlebar .navbar-brand {
		color: #101828;
		font-weight: 700;
		font-size: 1.35rem;
		letter-spacing: -0.01em;
	}

	.card {
		box-shadow: 0 1px 2px rgba(16,24,40,0.05);
	}
	.card-header{
		background: #fafbfc;
		padding: 1.1rem 1.5rem;
		border-bottom: 1px solid rgba(16,24,40,0.08);
	}
	.card-header h1, .card-header h2, .card-header h3, .card-header h4{
		margin-bottom: 0;
		font-size: 1.15rem;
		font-weight: 700;
		color: #101828;
	}
	.card-header.text-primary, .card-header .text-primary{
		color: #101828 !important;
	}
	.card-body{
		padding: 1.75rem;
	}

	.btn{
		font-weight: 500;
	}
	.card{
		border-radius: var(--bs-border-radius-lg);
		border: 1px solid rgba(16,24,40,0.06);
	}
	.dropdown-menu{
		border-radius: 0.75rem;
		border: 1px solid rgba(16,24,40,0.08);
		box-shadow: 0 4px 16px rgba(16,24,40,0.12);
	}
	.table{
		--bs-table-hover-bg: rgba(16,24,40,0.035);
		margin-bottom: 0;
	}
	.table thead th, .table thead td{
		font-size: 0.78em;
		text-transform: uppercase;
		letter-spacing: 0.03em;
		color: #667085;
		font-weight: 600;
		background: #f9fafb;
		border-bottom-width: 1px;
		white-space: nowrap;
	}
	.table tbody tr:hover{
		background: var(--bs-table-hover-bg);
	}
	.table td, .table th{
		vertical-align: middle;
	}
	.table-bordered{
		border: 1px solid rgba(16,24,40,0.08);
	}
	.table-bordered > :not(caption) > * > *{
		border-color: rgba(16,24,40,0.08);
	}
	.table-wrapper{
		border: 1px solid rgba(16,24,40,0.08);
		border-radius: 12px;
	}
	.table-wrapper .table{
		border: none;
	}
	.table-wrapper .table-bordered{
		border: none;
	}
	.modal-content{
		border-radius: var(--bs-border-radius-lg);
		border: none;
		box-shadow: 0 8px 32px rgba(16,24,40,0.18);
	}
	.form-control, .form-select{
		border-radius: 0.5rem;
		padding-top: 0.55rem;
		padding-bottom: 0.55rem;
		font-size: 0.92rem;
	}
	.form-control-sm, .form-select-sm{
		padding-top: 0.35rem;
		padding-bottom: 0.35rem;
	}
	.btn{
		padding: 0.5rem 1.15rem;
		border-radius: 0.5rem;
		font-size: 0.9rem;
	}
	.btn-sm{
		padding: 0.3rem 0.75rem;
	}
	.stat-tile{
		display: flex;
		align-items: flex-start;
		gap: 14px;
	}
	.stat-tile .stat-icon{
		width: 42px;
		height: 42px;
		border-radius: 10px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 1.05rem;
		flex-shrink: 0;
	}
	.stat-tile .stat-icon.good{ background: rgba(12,163,12,0.1); color: #0ca30c; }
	.stat-tile .stat-icon.bad{ background: rgba(211,55,55,0.1); color: #d33737; }
	.stat-tile .stat-value{
		font-size: 1.6rem;
		font-weight: 700;
		line-height: 1.2;
	}
	.modal-body label, .content label{
		margin-bottom: 0.35rem;
		font-weight: 500;
		display: inline-block;
	}
	.modal-header.bg-theme-light .modal-title{
		color: #232b3a;
	}
	.form-control:focus, .form-select:focus{
		box-shadow: 0 0 0 0.2rem rgba(0,0,0,0.06);
	}
		
		
		
		.table-wrapper{
			overflow: auto;
			overflow-y: hidden;
		}
		
		th, td {
			vertical-align: middle!important;
		}
		
		.avatar{
			
			display: inline-block;
			background-repeat: no-repeat;
			background-size: cover;
			background-position: center center;
			padding: 23px;
			border-radius: 23px;   
		}
		.form .row{
			padding: 10px 0px;
		}
		.form .row .label{
			font-weight: 600;
		}
		.form .row .error{
			padding: 5px 0px;
			color: #dc3545!important;
			font-size: 0.8em;
			font-weight1: 600;
		}
		.form-view .row:not(:last-child){
			border-bottom: 1px dotted #ddd;
		}
		
		
		.file-uploader{
			height: 300px;
			background: #efefef;
			border-radius: 5px;
		}		
		.image {
			width: 200px;
			height: 200px;
			background-size: contain;
			background-repeat: no-repeat;
		}
			
		.thumbnail {
			width: 60px;
			height: 60px;
			background-size: cover;
			background-repeat: no-repeat;
			border-radius: 30px;
		}
		.section {
			padding: 20px;
			margin: 0px 15px;
			margin-bottom: 30px;
			border: 1px solid rgba(16,24,40,0.06);
			border-radius: 14px;
			background: #fff;
			box-shadow: 0 1px 2px rgba(16,24,40,0.05), 0 4px 12px rgba(16,24,40,0.05);
		}
		
		.dashboard-block{
			padding-bottom: 50px;
		}
		table.dashboard-table th:not(:first-child),
		table.dashboard-table td
		{
			text-align: center;
		}

		table.dashboard-table td{
			cursor: pointer;
		}
		
		table .hyperlink-td{
			padding:0;
		}
		table .hyperlink-td a{
			text-decoration: none;
			color: inherit;
		}
		table .hyperlink-td  div{
			padding: 10px;
			width: 100%;
			height: 100%;
		}
		
		
		.cards .card{
			color: #fff;
			text-align: center;
		}
		.cards a{
			text-decoration: none;
		}
		.cards .card-wrapper:nth-child(1) .card{
			background: #6200ee;
		}
		.cards .card-wrapper:nth-child(2) .card{
			background: #ff0266;
		}
		.cards .card-wrapper:nth-child(3) .card{
			background: #09af00;
		}
		.cards .card-wrapper:nth-child(4) .card{
			background: #d602ee;
		}
		.cards .card-wrapper:nth-child(5) .card{
			background: #03dac5;
		}
		.cards .card-wrapper:nth-child(6) .card{
			background: #e54304;
		}
		
		/* Table Row Check Boxes */
			.row-check{
				cursor: pointer;
				user-select: none;
			}
			tr.row-check td:first-child{
				width: 40px;
			}
			.checked .icon-checked{
				display: block;
			}			
			.unchecked .icon-checked{
				display: none;
			}
		/*  End Table Row Check Boxes*/
		
		
			.dashboard-table-wrapper{
			  overflow:auto;
			  max-height:300px;
			}

	.stages .stage{		
		width: 200px;
		padding: 10px;
		margin: 10px;
		border: 1px solid #ddd;
		border-radius: 3px;
		display: inline-block;
		font-size: 0.9em;
	}
	
	.stages .completed{
		background: #00ff0020;
	}
	
	.stages .pending, td.pending, table.pb-table .inactive, tr.pending td{
		background: #ff000020;
	}
	
	.form-multi-cols div{
		padding: 10px 10px;
	}
	.form-multi-cols .error{
		color: red;
	}
	.navigation:hover {
		cursor: pointer;
	}

	@media print
	{
		.noprint {display:none;}
		
		table.small-padding td{
			padding: 5px;
		}
		table.small-padding th{
			padding: 10px 5px;
		}
		.table-bordered td, .table-bordered th{
			border: 1px solid #000!important;
		}

		.bg-theme{
			color: #000!important;
		}
	
	}
	.pagebreak { page-break-before: always; } /* page-break-after works, as well */
	
	table th.xl, td.xl{
		width: 230px!important;
		min-width: 230px!important;
		
	}
	table th.m, td.m{
		width: 170px!important;
		min-width: 170px!important;
		
	}
	
	table th.l, td.l{
		width: 130px!important;
		min-width: 130px!important;
		
	}
	
	table tr.exception{
		background: #ff000050;
	}
	
	td.mycolor{
		background-color:#E3F2DD;
	}
	th.total, tr.total{
		background-color:#EEEEEE;
	}



/* Card */	
	.card-transperent{
		background: none;
		border: none;
	}
	
	.card-sm{
		width: 500px;
	}
	
	/* Inputs */
	input.input-lg {
		padding: 20px;
	}
	
	/* Padding */
	.pad-xl{
		padding: 30px;
	}
	.pad-m{
		padding: 7px;
	}
	
	/* Logo */
	.logo-wrapper{
		display: inline-block;
		background: #fff;
		padding: 5px;
		border-radius: 10px;
	}
	.logo-wrapper-circle{
		background: #fff;
		padding: 20px;
		border-radius: 50%;
	}
	.logo {
		background-repeat: no-repeat;
		background-position: center;
		background-size: contain;
	}
	.logo-small{		
		width: 30px;
		height: 30px;
	}
	.logo-large{		
		width: 100px;
		height: 100px;
	}
	
	
	/* Login */
	.login-btn{
		width: 49%;
	}
	.login-btn:nth-child(2) {
		margin-right:auto;
		float: right;
	}

	
	@media only screen and (min-width: 768px) {
		/* tablets and desktop */
	}

	@media only screen and (max-width: 767px) {
		
		/* Padding */
		.pad-xl{
			padding: 15px;
		}
		.pad-m{
			padding: 5px;
		}
	
		/* Card */		
		.card-sm{
			width: 90%;
		}
	
		/* phones */
		.logo-large{		
			width: 60px;
			height: 60px;
		}
		.input-group-addon, .input-group-btn, .input-group .form-control {
			display: block;
			margin-bottom: 10px;
			clear: both;
		}
		.input-group {
			display: block;
		}
	}

	@media only screen and (max-width: 767px) and (orientation: portrait) {
		/* portrait phones */
	}