.custom-shape-divider-top {
    width: 100%;
    overflow: hidden;
    line-height: 0;
    transform: rotate(180deg);
}

.custom-shape-divider-top svg, .custom-shape-divider-bottom svg {
    position: relative;
    display: block;
	left: -12px;
    width: 110%;
    height: 75px;
}

.custom-shape-divider-top .shape-fill, .custom-shape-divider-bottom .shape-fill {
    fill: #002973;
}

.custom-shape-divider-bottom {
    width: 100%;
    overflow: hidden;
    line-height: 0;
}

/* Main layout uses offcanvas only; do not show desktop sidebar column */
#sidebar {
	display: none !important;
}

@media (min-width: 768px) {
	.content {
		margin-top: 56px;
		min-height: calc(100vh - 56px);
		overflow-x: hidden;
	}
}

.inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.inputfile + label {
    max-width: 100%;
    font-size: 1rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
}

.no-js .inputfile + label {
    display: none;
}

.inputfile:focus + label,
.inputfile.has-focus + label {
    outline: 1px dotted #000;
    outline: -webkit-focus-ring-color auto 5px;
}

.inputfile + label svg {
    width: 1em;
    height: 1em;
    vertical-align: middle;
    fill: currentColor;
    margin-top: -0.25em;
    /* 4px */
    margin-right: 0.25em;
    /* 4px */
}

/* style 1 */

.inputfile-1 + label {
    color: #f1e5e6;
    background-color: #d3394c;
}

.inputfile-1:focus + label,
.inputfile-1.has-focus + label,
.inputfile-1 + label:hover {
    background-color: #722040;
}

/* style 3 */

.inputfile-3 + label {
    color: var(--primary);
}

.inputfile-3:focus + label,
.inputfile-3.has-focus + label,
.inputfile-3 + label:hover {
    color: var(--gray-dark);
}

/* style 4 */

.inputfile-4 + label {
    color: #7ace4c;
}

.inputfile-4:focus + label,
.inputfile-4.has-focus + label,
.inputfile-4 + label:hover {
    color: var(--gray-secondary);
}

.inputfile-4 + label figure {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background-color: var(--primary);
    display: block;
    padding: 20px;
    margin: 0 auto 10px;
}

.inputfile-4:focus + label figure,
.inputfile-4.has-focus + label figure,
.inputfile-4 + label:hover figure {
    background-color: var(--gray-dark);
}

.inputfile-4 + label svg {
    width: 100%;
    height: 100%;
    fill: var(--white);
}
/* Mobile Consolidated Navigation Styles */
@media (max-width: 991px) {
	/* Hide desktop sidebar on mobile */
	#sidebar {
		display: none !important;
	}

	.fixed-top,
	header,
	.navbar,
	.topbar {
		position: static !important;
		top: auto !important;
		left: auto !important;
		right: auto !important;
	}

	body {
		padding-top: 0 !important;
	}

	/* Content takes full width on mobile */
	.content {
		margin-top: 0 !important;
		margin-left: 0 !important;
	}
	/* Hide desktop sidebar on mobile */
	#sidebar {
		display: none !important;
	}

	/* Offcanvas menu visibility and styling */
	.offcanvas {
		z-index: 1050;
		background-color: #f8f9fa !important;
	}

	.offcanvas.offcanvas-start {
		width: 85vw !important;
		max-width: 350px;
	}

	.offcanvas-header {
		background-color: #002973;
		color: white;
		border-bottom: 1px solid #dee2e6;
	}

	.offcanvas-header .offcanvas-title {
		color: white;
	}

	.offcanvas-header .btn-close {
		filter: brightness(0) invert(1);
	}

	.offcanvas-body {
		padding: 1rem;
		background-color: #f8f9fa;
	}

	/* Offcanvas nav-link styling */
	.offcanvas-body .nav-link {
		padding: 0.75rem 0.5rem;
		color: #212529 !important;
		text-decoration: none;
		border-left: 3px solid transparent;
		transition: all 0.3s ease;
		display: block;
	}

	.offcanvas-body .nav-link:hover {
		background-color: #e9ecef;
		border-left-color: #002973;
		padding-left: 1rem;
	}

	.offcanvas-body .nav-link.active {
		background-color: #e9ecef;
		border-left-color: #002973;
		font-weight: 500;
		color: #002973 !important;
	}

	/* Collapsible section styling for navbar items */
	.offcanvas-body .btn-link {
		color: #212529 !important;
		text-decoration: none;
		font-weight: 500;
		padding: 0.75rem 0.5rem;
		border-left: 3px solid transparent;
		transition: all 0.3s ease;
		text-align: left;
		width: 100%;
	}

	.offcanvas-body .btn-link:hover:not(.collapsed) {
		background-color: #e9ecef;
	}

	.offcanvas-body .btn-link:not(.collapsed) {
		background-color: #e9ecef;
		border-left-color: #002973;
		padding-left: 1rem;
		color: #002973 !important;
	}

	.offcanvas-body .btn-link:focus {
		box-shadow: none;
	}

	.offcanvas-body .btn-link.active {
		background-color: #e9ecef;
		border-left-color: #002973;
		font-weight: 600;
		color: #002973 !important;
	}

	.offcanvas-body .collapse {
		margin-left: 0;
	}

	.offcanvas-body .ps-3 .nav-link {
		padding-top: 0.5rem;
		padding-bottom: 0.5rem;
		font-size: 0.95rem;
		padding-left: 1rem;
	}

	.offcanvas-body .ps-3 .nav-link.active {
		background-color: #e9ecef;
		border-left-width: 3px;
		font-weight: 500;
	}

	/* Sidebar items section */
	.sidebar-items {
		display: flex;
		flex-direction: column;
	}

	.sidebar-items .nav-link {
		padding: 0.75rem 0.5rem;
		color: #212529 !important;
		text-decoration: none;
		border-left: 3px solid transparent;
		transition: all 0.3s ease;
	}

	.sidebar-items .nav-link:hover {
		background-color: #e9ecef;
		border-left-color: #002973;
		padding-left: 1rem;
	}

	.sidebar-items .nav-link.active {
		background-color: #e9ecef;
		border-left-color: #002973;
		font-weight: 500;
		color: #002973 !important;
	}

	/* Ensure mobile hamburger button is visible */
	.navbar .btn-outline-light {
		border-color: rgba(255, 255, 255, 0.5);
		color: rgba(255, 255, 255, 0.85);
	}

	.navbar .btn-outline-light:hover {
		border-color: #ffffff;
		color: #ffffff;
	}
}

/* Global offcanvas backdrop styling for subtle effect */
.offcanvas-backdrop {
	z-index: 1040;
	background-color: rgba(0, 0, 0, 0.1) !important;
}