:root {
	--primary-color: #00498E;
	--border-color: #d9d9d9;
}

.btn-primary {
	--bs-btn-bg: #00498E;
	--bs-btn-border-color: #00498E;
	--bs-btn-disabled-bg: #00498E;
	--bs-btn-disabled-border-color: #00498E;
}

.w-max-content {
	width: max-content !important;
}

a {
	text-decoration: none;
	color: #212529;
}

form h6 {
	margin-top: 8px;
}

.header .container .logo,
.header .container .menu,
.header .container .action {
	flex: 1;
}

.header .container .menu {
	justify-content: center;
}

.header .container .action {
	text-align: end;
}

.header .logo img {
	width: 60px;
	height: auto;
}

.header .menu .item {
	font-weight: 600;
	margin: 0;
	line-height: 2;
}

.header .menu .item.active {
	color: var(--primary-color);
	border-bottom: 1px solid var(--primary-color);
}

.body {
	background-color: #f5fbfd;
	padding: 24px
}

.body .container {
	background-color: #fff;
}

form .row .col-12 {
	display: flex;
	align-items: center;
	column-gap: 16px;
	margin-bottom: 16px;
}

form .row .col-12 .field-label {
	text-align: end;
	width: 40%;
}

form .row .col-12 .field-value {
	width: 60%;
	position: relative;
}

form .row .col-12.long-field .field-label {
	width: 19%;
}

form .row .col-12.long-field .field-value {
	width: 81%;
}

form .row .col-md-3:has(label:not(.custom-checkbox)) {
	justify-content: end;
}

form .row .col-md-3 label:not(.custom-checkbox) {
	text-align: end;
	width: auto;
}

form .custom-checkbox {
	width: 100%;
	display: block;
	border: 1px solid var(--border-color);
	text-align: start;
	border-radius: 10px;
	padding: 16px;
	cursor: pointer;
}

form .row .col-12 .custom-checkbox input {
	width: auto;
}

form .row .col-12 label.upload-image {
	width: max-content;
	padding: 8px 16px;
	color: var(--primary-color);
	border: 1px solid var(--border-color);
	border-radius: 8px;
	cursor: pointer;
}

form .invalid-feedback {
	background-color: #F78B83;
    border-color: #D95252;
    color: #912323;
	max-width: 280px;
    min-width: 50px;
	width: auto;
	padding: 5px;
	font-size: 10.5px;
    line-height: 12px;
    direction: ltr;
	position: absolute;
	top: -35px;
	left: 0px;
}

form .invalid-feedback::before {
	content: "";
    left: 0px;
    bottom: -15px;
    position: absolute;
    border-color: #F78B83 transparent transparent transparent;
    border-style: solid;
    border-width: 8px 8px 8px 0px;
}

.submit-success .title i {
	color: #30b083;
	font-size: 80px;
}

.submit-success .title h4 {
	color: #006694;
}

div:where(.swal2-icon).swal2-info {
	border-color: #dc3545;
    color: #dc3545;
}

div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm {
	background-color: #0d6efd;
    width: 100px;
}

.img-preview img {
	width: 150px;
	height: auto;
	border-radius: 8px;
}

@media (max-width: 991px) {
	.header .container .logo,
	.header .container .menu,
	.header .container .action {
		flex: auto;
	}
}

@media (max-width: 767px) {
	form .row .col-12 .field-label, form .row .col-12 .field-value,
	form .row .col-12.long-field .field-label, form .row .col-12.long-field .field-value {
		width: 100%;
	}
}

@media (max-width: 576px) {
	.footer .container {
		flex-direction: column;
	}

	.header .menu {
		font-size: 13px;
	}

	.header .logo img {
		width: 40px;
	}

	.header .action button {
		font-size: 13px;
		padding: 5px 10px;
		line-height: 1.3;
	}

	.body {
		font-size: 13px;
		padding: 12px;
	}

	form .row .col-12 {
		margin-bottom: 8px;
	}

	p {
		margin-bottom: 4px;
	}
}