/*
 * Tailwind to Bootstrap 5 Migration Fixes
 * Specific fixes for conversion issues found in the project
 */

/* Fix responsive width classes */
.w-100-xl {
	width: 100% !important;
}

@media (min-width: 1200px) {
	.w-100-xl {
		width: 33.333333% !important;
	}
}

/* Fix responsive padding classes */
.px-5-md {
	padding-left: 1rem !important;
	padding-right: 1rem !important;
}

@media (min-width: 768px) {
	.px-5-md {
		padding-left: 2.5rem !important;
		padding-right: 2.5rem !important;
	}
}

.pt-5-md {
	padding-top: 1.25rem !important;
}

@media (min-width: 768px) {
	.pt-5-md {
		padding-top: 8rem !important;
	}
}

/* Fix grid system replacements */
.xl\:w-4\/12 {
	width: 100% !important;
}

@media (min-width: 1200px) {
	.xl\:w-4\/12 {
		width: 33.333333% !important;
	}
}

.xl\:w-8\/12 {
	width: 100% !important;
}

@media (min-width: 1200px) {
	.xl\:w-8\/12 {
		width: 66.666667% !important;
	}
}

/* Fix button classes */
.bg-blue-400 {
	background-color: #3b82f6 !important;
}

.hover\:bg-blue-700:hover {
	background-color: #1d4ed8 !important;
}

.bg-blue-500 {
	background-color: #3b82f6 !important;
}

.hover\:bg-blue-700:hover {
	background-color: #1d4ed8 !important;
}

/* Fix focus states */
.focus\:outline-none:focus {
	outline: none !important;
	box-shadow: none !important;
}

.focus\:shadow-outline:focus {
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
}

/* Fix border colors */
.border-gray-300 {
	border-color: #d1d5db !important;
}

/* Fix form input styling */
.form-control.mt-2 {
	margin-top: 0.5rem !important;
}

/* Fix appearance none for select elements */
.appearance-none {
	appearance: none !important;
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
}

/* Fix table responsive padding */
.p-3 {
	padding: 0.75rem !important;
}

.p-5 {
	padding: 1.25rem !important;
}

/* Fix negative margins */
.custom-negative-m-24,
.-m-24 {
	margin: -6rem !important;
}

/* Fix text colors */
.text-blue-700 {
	color: #1d4ed8 !important;
}

/* Fix min-width issues */
.mw-100 {
	min-width: 0 !important;
}

/* Fix break-words */
.text-break {
	word-wrap: break-word !important;
	word-break: break-word !important;
}

/* Fix leading/line-height */
.lh-base {
	line-height: 1.5 !important;
}

/* Fix list styles */
.list-unstyled {
	list-style: none !important;
	padding-left: 0 !important;
}

/* Fix shadow classes */
.shadow {
	box-shadow:
		0 1px 3px 0 rgba(0, 0, 0, 0.1),
		0 1px 2px 0 rgba(0, 0, 0, 0.06) !important;
}

/* Fix border radius */
.rounded-3 {
	border-radius: 0.5rem !important;
}

/* Fix background dark */
.bg-dark {
	background-color: #212529 !important;
}

/* Fix container behavior */
.container-custom {
	max-width: 1280px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: 1rem !important;
	padding-right: 1rem !important;
}

/* Fix flex utilities that might be missing */
.d-flex {
	display: flex !important;
}

.flex-wrap {
	flex-wrap: wrap !important;
}

.flex-column {
	flex-direction: column !important;
}

/* Fix position utilities */
.position-relative {
	position: relative !important;
}

.position-absolute {
	position: absolute !important;
}

/* Fix responsive display classes */
@media (max-width: 575.98px) {
	.d-sm-none {
		display: none !important;
	}
}

@media (min-width: 992px) {
	.d-lg-inline-block {
		display: inline-block !important;
	}
}

/* Fix button styling for consistent appearance */
.btn-primary-custom {
	background-color: #3b82f6 !important;
	border-color: #3b82f6 !important;
	color: white !important;
	font-weight: 700 !important;
	padding: 0.5rem 1rem !important;
	border-radius: 0.375rem !important;
	border: none !important;
	cursor: pointer !important;
	text-decoration: none !important;
	display: inline-block !important;
	transition: background-color 0.15s ease-in-out !important;
}

.btn-primary-custom:hover {
	background-color: #1d4ed8 !important;
	border-color: #1d4ed8 !important;
	color: white !important;
}

.btn-primary-custom:focus {
	box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25) !important;
	background-color: #1d4ed8 !important;
	border-color: #1d4ed8 !important;
	color: white !important;
}

/* Fix table styling */
.table-responsive {
	/*overflow-x: auto !important;*/
	border-radius: 36px;
	padding: 10px;
}

.table th,
.table td {
	vertical-align: middle !important;
}

/* Fix card styling */
.card {
	background-color: white !important;
	border: 1px solid rgba(0, 0, 0, 0.125) !important;
	border-radius: 0.375rem !important;
	box-shadow:
		0 1px 3px 0 rgba(0, 0, 0, 0.1),
		0 1px 2px 0 rgba(0, 0, 0, 0.06) !important;
}

.card-body {
	padding: 1rem !important;
}

/* Fix form group spacing */
.form-group {
	/*margin-bottom: 1rem !important;*/
}

/* Fix select2 integration with Bootstrap */
.select2-container--default .select2-selection--single {
	height: calc(2.25rem + 2px) !important;
	border: 1px solid #ced4da !important;
	border-radius: 0.375rem !important;
}

.select2-container--default
	.select2-selection--single
	.select2-selection__rendered {
	line-height: 2.25rem !important;
	padding-left: 0.75rem !important;
}

/* Fix responsive behavior for mobile */
@media (max-width: 767.98px) {
	.px-5-md {
		padding-left: 1rem !important;
		padding-right: 1rem !important;
	}

	.pt-5-md {
		padding-top: 3rem !important;
	}

	.w-100-xl {
		width: 100% !important;
	}
}

/* Fix antialiasing */
.antialiased {
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
}

/* Fix overflow utilities */
.overflow-x-auto {
	overflow-x: auto !important;
}

.overflow-hidden {
	overflow: hidden !important;
}

/* Additional utility fixes */
.cursor-pointer {
	cursor: pointer !important;
}

.user-select-none {
	user-select: none !important;
}

.pointer-events-none {
	pointer-events: none !important;
}

/* Fix text alignment */
.text-start {
	text-align: left !important;
}

.text-end {
	text-align: right !important;
}

.text-center {
	text-align: center !important;
}

/* Fix font weights */
.fw-bold {
	font-weight: 700 !important;
}

.fw-semibold {
	font-weight: 600 !important;
}

.fw-normal {
	font-weight: 400 !important;
}

/* Fix spacing utilities for larger values */
.p-6 {
	padding: 1.5rem !important;
}

.p-8 {
	padding: 2rem !important;
}

.p-10 {
	padding: 2.5rem !important;
}

.px-6 {
	padding-left: 1.5rem !important;
	padding-right: 1.5rem !important;
}

.px-8 {
	padding-left: 2rem !important;
	padding-right: 2rem !important;
}

.px-10 {
	padding-left: 2.5rem !important;
	padding-right: 2.5rem !important;
}

.py-6 {
	padding-top: 1.5rem !important;
	padding-bottom: 1.5rem !important;
}

.py-8 {
	padding-top: 2rem !important;
	padding-bottom: 2rem !important;
}

.py-10 {
	padding-top: 2.5rem !important;
	padding-bottom: 2.5rem !important;
}

.mb-6 {
	margin-bottom: 1.5rem !important;
}

.mb-12 {
	margin-bottom: 3rem !important;
}

/* Login page specific fixes */
.login-container {
	min-height: 100vh !important;
	background-attachment: fixed !important;
}

.login-card {
	max-width: 420px !important;
	border: none !important;
	border-radius: 15px !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
}

.login-logo {
	max-width: 180px !important;
	height: auto !important;
}

.login-form .form-control {
	border-radius: 8px !important;
	padding: 12px 16px !important;
	border: 1px solid #ced4da !important;
	transition: all 0.15s ease-in-out !important;
}

.login-form .form-control:focus {
	border-color: #0d6efd !important;
	box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25) !important;
}

.login-form .form-select {
	border-radius: 8px !important;
	padding: 12px 16px !important;
	border: 1px solid #ced4da !important;
}

.login-btn {
	padding: 12px 0 !important;
	border-radius: 8px !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	transition: all 0.15s ease-in-out !important;
}

.login-btn:hover {
	transform: translateY(-1px) !important;
	box-shadow: 0 4px 12px rgba(13, 110, 253, 0.4) !important;
}

/* Fix for form validation styling */
.was-validated .form-control:valid,
.form-control.is-valid {
	border-color: #198754 !important;
}

.was-validated .form-control:invalid,
.form-control.is-invalid {
	border-color: #dc3545 !important;
}

/* Responsive adjustments for login */
@media (max-width: 576px) {
	.login-card {
		margin: 15px !important;
		width: calc(100% - 30px) !important;
	}

	.login-logo {
		max-width: 150px !important;
	}
}