:root
{
	--sb-navy: #13213a;
	--sb-navy-strong: #0b1628;
	--sb-blue: #356fce;
	--sb-blue-soft: #edf4ff;
	--sb-cyan: #4bb4d3;
	--sb-green: #159957;
	--sb-green-soft: #ebf8f1;
	--sb-amber: #d98b00;
	--sb-amber-soft: #fff7e6;
	--sb-red: #cf3f4f;
	--sb-red-soft: #fff0f2;
	--sb-purple: #7357c7;
	--sb-purple-soft: #f4f0ff;
	--sb-slate-900: #263343;
	--sb-slate-700: #516072;
	--sb-slate-500: #7c8999;
	--sb-slate-300: #d8dee7;
	--sb-slate-200: #e8edf3;
	--sb-slate-100: #f5f7fa;
	--sb-white: #ffffff;
	--sb-sidebar-width: 270px;
	--sb-topbar-height: 76px;

	/* Light theme (property manager form) */
	--sr-bg: #F6F7FA;
	--sr-surface: #FFFFFF;
	--sr-surface-alt: #FBFBFC;
	--sr-border: #E3E6ED;
	--sr-text: #1A1F2E;
	--sr-text-muted: #6B7280;

	/* Dark theme (regional / corporate dashboard + report) */
	--sr-dark-bg: #1A1F2E;
	--sr-dark-surface: #232A3B;
	--sr-dark-surface-alt: #1E2436;
	--sr-dark-border: #2A3248;
	--sr-dark-text: #FFFFFF;
	--sr-dark-text-muted: #8A93AB;

	/* Brand + semantic accents */
	--sr-red: #DC143C;
	--sr-red-dim: #B01030;
	--sr-red-tint: #FCE8EC;
	--sr-green-l: #158A42;
	--sr-green-d: #22C55E;
	--sr-green-tint: #E7F7EE;
	--sr-orange-l: #C2530A;
	--sr-orange-d: #F97316;
	--sr-orange-tint: #FDEEE3;
	--sr-neutral-tint: #EEF0F4;

	/* Type */
	--sr-font-display: 'Space Grotesk', sans-serif;
	--sr-font-body: 'Inter', sans-serif;
	--sr-font-mono: 'IBM Plex Mono', monospace;

	/* Shape */
	--sr-radius: 0.5rem;
	--sr-tab-width: 0.3rem;
}

textarea
{
	resize: none;
}

body
{
	font-family: var(--sr-font-body);
	color: var(--sr-text);
	background-color: var(--sr-bg);
}

body.sr-theme-dark
{
	color: var(--sr-dark-text);
	background-color: var(--sr-dark-bg);
}

h1,
h2,
h3,
h4,
h5,
.sr-font-display {
	font-family: var(--sr-font-display);
}

.sr-font-mono {
	font-family: var(--sr-font-mono);
}

.sr-text-muted-light {
	color: var(--sr-text-muted);
}

.sr-text-muted-dark {
	color: var(--sr-dark-text-muted);
}

.min-vh-50
{
	min-height: 50vh;
}

.max-vh-50
{
	max-height: 50vh;
}

.disabled
{
    opacity: .55;
    pointer-events: none;
    user-select: none;
}

	form.disabled
	{
    	opacity: 1;
	}

nav .dropdown-menu.show
{
	z-index: 1022;
}

footer
{
	padding-top: 20px;
}

#pageLogin,
#pageTwoFactor,
.errorPage
{
    padding-top: 50px;

}

	#pageLogin #formContainer,
	#pageTwoFactor #formContainer
	{
		border-left: 1px solid #DEDEDE;
		min-height: 355px;
		padding-bottom: 20px;
		padding-left: 7.33333333%;
	}

	   #pageLogin #formContainer .form-group,
	   #pageTwoFactor #formContainer .form-group
       {
           margin-bottom: 15px;
       }

	#pageLogin h3,
    .errorPage h3
	{
		color: #2E4854;
		font-weight: bold;
		padding-bottom: 10px;
	}

		#pageTwoFactor h3,
		{
			color: #2E4854;
			font-weight: bold;
			padding-bottom: 10px;
		}

	#pageLogin ul.nav.nav-pills,
	.errorPage ul.nav.nav-pills
	{
		margin-bottom: 15px;
	}

		#pageLogin ul.nav.nav-pills li,
		.errorPage ul.nav.nav-pills li
		{
			display: inline-block;
			float: none;
		}

			#pageLogin .nav-pills > li,
			.errorPage .nav-pills > li
			{
				padding-right: 10px;
			}

				#pageLogin .nav-pills > li:last-child,
				.errorPage .nav-pills > li:last-child
				{
					border-right: 0;
				}

			#pageLogin .nav-pills > li.active span,
			#pageLogin .nav-pills > li span:hover,
			.errorPage .nav-pills > li.active span,
			.errorPage .nav-pills > li span:hover
			{
				border-bottom: 1px solid;
			}

			#pageLogin .nav-pills > li a,
			.errorPage .nav-pills > li a
			{
				color: #888888;
			}

			#pageLogin .nav-pills > li a.active,
			.errorPage .nav-pills > li a.active
			{
				color: #2E4854;
				font-weight: bold;
				text-decoration: none;
			}

				#pageLogin .nav-pills > li a:hover,
				.errorPage .nav-pills > li a:hover
				{
					text-decoration: none;
				}

	#pageLogin footer,
	.errorPage footer
	{
		margin-top: 50px;
	}

    #pageLogin .btn-primary
    {
        background-color: #337ab7;
        border-color: #2e6da4;
    }

.form-outline.has-error .form-notch > *,
.form-outline.has-error .form-control:focus
{
	border-color: #f93154 !important;
}

	.form-outline.has-error .form-control:focus~.form-label,
	.form-outline.has-error .form-control.active~.form-label
	{
		color: #f93154 !important;
	}

	.form-outline.has-error .form-control:focus~.form-notch .form-notch-middle,
	.form-outline.has-error .form-control.active~.form-notch .form-notch-middle
	{
		border-top: 0;
	}

	.form-outline.has-error .form-control:focus~.form-notch > *
	{
		box-shadow: none;
	}

.navbar
{
    background-color: var(--sr-dark-surface);
    border-bottom: 1px solid var(--sr-dark-border);
}

.priorities-card
{
	background: var(--sr-dark-bg);
    border-radius: 18px;
    color: var(--sr-dark-text);
}

.section-title
{
	font-family: var(--sr-font-display);
}

.section-title .pulse
{
	width: 7px;
	height: 7px;
	background-color: #FF6B84;
	border-radius: 50%;
	animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse
{

	0%,100%
	{
		opacity:1
	}

	50%
	{
		opacity:.3
	}
}

.sr-card {
	background-color: var(--sr-surface);
	border: 1px solid var(--sr-border);
	border-radius: var(--sr-radius);
}

.sr-card-dark {
	background-color: var(--sr-dark-surface);
	border: 1px solid var(--sr-dark-border);
	border-radius: var(--sr-radius);
}

.sr-count-badge {
	font-family: var(--sr-font-mono);
	font-size: 0.72rem;
	font-weight: 600;
	background-color: var(--sr-neutral-tint);
	color: var(--sr-text-muted);
	border-radius: 1rem;
	padding: 0.15rem 0.55rem;
}

.sr-count-badge-dark {
	font-family: var(--sr-font-mono);
	font-size: 0.72rem;
	font-weight: 600;
	background-color: var(--sr-dark-surface-alt);
	color: var(--sr-dark-text-muted);
	border-radius: 1rem;
	padding: 0.15rem 0.55rem;
}

.sr-table-dark
{
	background-color: var(--sr-dark-surface-alt);
	border-color: var(--sr-dark-border);
	color: var(--sr-dark-text-muted);
}

.sb-page-title
{
	margin-bottom: 0.25rem;
	color: var(--sb-navy);
	font-size: clamp(1.55rem, 2vw, 2.15rem);
	font-weight: 700;
	letter-spacing: -0.025em;
}

.sb-page-subtitle
{
	max-width: 760px;
	margin-bottom: 0;
	color: var(--sb-slate-700);
}

.sb-section-title
{
	color: var(--sb-navy);
	font-size: 1rem;
	font-weight: 700;
}

.sb-eyebrow
{
	color: var(--sb-blue);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.row.submissionApproved .btnApproveReport
{
	--mdb-btn-bg: #14a44d;
	pointer-events: none;
	color: #FFFFFF;
}

.row.submissionRejected .btnRejectReport
{
	--mdb-btn-bg: #dc4c64;
	pointer-events: none;
	color: #FFFFFF;
}

.approvalStatusText
{
	display: none;
}

	.row.submissionApproved .approvedText
	{
		display: block;
	}

	.row.submissionRejected .rejectedText
	{
		display: block;
	}

	.row.submissionApproved .card-header
	{
		--mdb-text-opacity: 1;
		--mdb-bg-opacity: 1;
		background-color: rgba(var(--mdb-success-rgb), var(--mdb-bg-opacity)) !important;
		color: rgba(var(--mdb-white-rgb), var(--mdb-text-opacity)) !important;
	}

	.row.submissionRejected .card-header
	{
		--mdb-text-opacity: 1;
		--mdb-bg-opacity: 1;
		background-color: rgba(var(--mdb-danger-rgb), var(--mdb-bg-opacity)) !important;
		color: rgba(var(--mdb-white-rgb), var(--mdb-text-opacity)) !important;
	}

.sb-org
{
	background: var(--sb-red);
	border-radius: 10px;
	min-width: 200px;
}

.sb-org:hover
{
	background: rgba(207, 63, 79, .8);
}

.sb-avatar
{
	width: 28px;
	height: 28px;
	background: var(--sb-navy-strong);
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 10px;
	font-weight: 600;
	color: #fff;
	flex-shrink: 0;
}

.sb-org-name
{
	font-size: 12px;
	font-weight: 500;
	color: var(--sb-amber-soft);
	line-height: 1.3;
}

.sb-org-role
{
	font-size: 10px;
	font-weight: 300;
	color: var(--sb-slate-900);
}

.sb-org-chevron
{
	margin-left: auto;
	color: rgba(245,240,232,.3);
	font-size: 10px;
}