/*
 * Tailwind to Bootstrap 5 Migration CSS
 * This file provides CSS classes to bridge Tailwind CSS to Bootstrap 5
 * Use this as a transition helper during migration
 */

/* Layout & Flexbox */
.flex {
	display: flex !important;
}
.flex-wrap {
	flex-wrap: wrap !important;
}
.flex-col {
	flex-direction: column !important;
}
.flex-row {
	flex-direction: row !important;
}
.items-center {
	align-items: center !important;
}
.justify-center {
	justify-content: center !important;
}
.justify-between {
	justify-content: space-between !important;
}
.justify-end {
	justify-content: flex-end !important;
}

/* Width classes */
.w-full {
	width: 100% !important;
}
.w-1\/2 {
	width: 50% !important;
}
.w-1\/3 {
	width: 33.333333% !important;
}
.w-2\/3 {
	width: 66.666667% !important;
}
.w-1\/4 {
	width: 25% !important;
}
.w-3\/4 {
	width: 75% !important;
}
.w-1\/5 {
	width: 20% !important;
}
.w-2\/5 {
	width: 40% !important;
}
.w-3\/5 {
	width: 60% !important;
}
.w-4\/5 {
	width: 80% !important;
}
.w-1\/6 {
	width: 16.666667% !important;
}
.w-5\/6 {
	width: 83.333333% !important;
}
.w-1\/12 {
	width: 8.333333% !important;
}
.w-2\/12 {
	width: 16.666667% !important;
}
.w-3\/12 {
	width: 25% !important;
}
.w-4\/12 {
	width: 33.333333% !important;
}
.w-5\/12 {
	width: 41.666667% !important;
}
.w-6\/12 {
	width: 50% !important;
}
.w-7\/12 {
	width: 58.333333% !important;
}
.w-8\/12 {
	width: 66.666667% !important;
}
.w-9\/12 {
	width: 75% !important;
}
.w-10\/12 {
	width: 83.333333% !important;
}
.w-11\/12 {
	width: 91.666667% !important;
}

/* Height classes */
.h-full {
	height: 100% !important;
}
.h-screen {
	height: 100vh !important;
}

/* Padding classes */
.p-1 {
	padding: 0.25rem !important;
}
.p-2 {
	padding: 0.5rem !important;
}
.p-3 {
	padding: 0.75rem !important;
}
.p-4 {
	padding: 1rem !important;
}
.p-5 {
	padding: 1.25rem !important;
}
.p-6 {
	padding: 1.5rem !important;
}
.p-8 {
	padding: 2rem !important;
}
.p-10 {
	padding: 2.5rem !important;
}

.px-1 {
	padding-left: 0.25rem !important;
	padding-right: 0.25rem !important;
}
.px-2 {
	padding-left: 0.5rem !important;
	padding-right: 0.5rem !important;
}
.px-3 {
	padding-left: 0.75rem !important;
	padding-right: 0.75rem !important;
}
.px-4 {
	padding-left: 1rem !important;
	padding-right: 1rem !important;
}
.px-5 {
	padding-left: 1.25rem !important;
	padding-right: 1.25rem !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-1 {
	padding-top: 0.25rem !important;
	padding-bottom: 0.25rem !important;
}
.py-2 {
	padding-top: 0.5rem !important;
	padding-bottom: 0.5rem !important;
}
.py-3 {
	padding-top: 0.75rem !important;
	padding-bottom: 0.75rem !important;
}
.py-4 {
	padding-top: 1rem !important;
	padding-bottom: 1rem !important;
}
.py-5 {
	padding-top: 1.25rem !important;
	padding-bottom: 1.25rem !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;
}

.pt-12 {
	padding-top: 3rem !important;
}
.pt-32 {
	padding-top: 8rem !important;
}
.pb-6 {
	padding-bottom: 1.5rem !important;
}
.pb-32 {
	padding-bottom: 8rem !important;
}

/* Margin classes */
.m-1 {
	margin: 0.25rem !important;
}
.m-2 {
	margin: 0.5rem !important;
}
.m-3 {
	margin: 0.75rem !important;
}
.m-4 {
	margin: 1rem !important;
}
.m-5 {
	margin: 1.25rem !important;
}
.m-6 {
	margin: 1.5rem !important;
}
.m-8 {
	margin: 2rem !important;
}

.mx-auto {
	margin-left: auto !important;
	margin-right: auto !important;
}
.mb-0 {
	margin-bottom: 0 !important;
}
.mb-6 {
	margin-bottom: 1.5rem !important;
}
.mb-12 {
	margin-bottom: 3rem !important;
}
.-m-24 {
	margin: -6rem !important;
}

/* Background colors */
.bg-white {
	background-color: #ffffff !important;
}
.bg-gray-100 {
	background-color: #f7fafc !important;
}
.bg-gray-200 {
	background-color: #edf2f7 !important;
}
.bg-gray-300 {
	background-color: #e2e8f0 !important;
}
.bg-gray-400 {
	background-color: #cbd5e0 !important;
}
.bg-gray-500 {
	background-color: #a0aec0 !important;
}
.bg-gray-600 {
	background-color: #718096 !important;
}
.bg-gray-700 {
	background-color: #4a5568 !important;
}
.bg-gray-800 {
	background-color: #2d3748 !important;
}
.bg-gray-900 {
	background-color: #1a202c !important;
}
.bg-dark {
	background-color: #343a40 !important;
}

.bg-blue-400 {
	background-color: #4299e1 !important;
}
.bg-blue-500 {
	background-color: #3182ce !important;
}
.bg-blue-600 {
	background-color: #2b77cb !important;
}
.bg-blue-700 {
	background-color: #2c5aa0 !important;
}

/* Text colors */
.text-white {
	color: #ffffff !important;
}
.text-black {
	color: #000000 !important;
}
.text-gray-100 {
	color: #f7fafc !important;
}
.text-gray-200 {
	color: #edf2f7 !important;
}
.text-gray-300 {
	color: #e2e8f0 !important;
}
.text-gray-400 {
	color: #cbd5e0 !important;
}
.text-gray-500 {
	color: #a0aec0 !important;
}
.text-gray-600 {
	color: #718096 !important;
}
.text-gray-700 {
	color: #4a5568 !important;
}
.text-gray-800 {
	color: #2d3748 !important;
}
.text-gray-900 {
	color: #1a202c !important;
}

/* Border */
.border {
	border: 1px solid #e2e8f0 !important;
}
.border-gray-300 {
	border-color: #e2e8f0 !important;
}
.border-gray-700 {
	border-color: #4a5568 !important;
}

/* Border radius */
.rounded {
	border-radius: 0.375rem !important;
}
.rounded-lg {
	border-radius: 0.5rem !important;
}

/* Shadow */
.shadow {
	box-shadow:
		0 1px 3px 0 rgba(0, 0, 0, 0.1),
		0 1px 2px 0 rgba(0, 0, 0, 0.06) !important;
}
.shadow-lg {
	box-shadow:
		0 10px 15px -3px rgba(0, 0, 0, 0.1),
		0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

/* Position */
.relative {
	position: relative !important;
}
.absolute {
	position: absolute !important;
}

/* Misc */
.min-w-0 {
	min-width: 0 !important;
}
.break-words {
	word-wrap: break-word !important;
}
.antialiased {
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
}
.appearance-none {
	appearance: none !important;
}
.leading-normal {
	line-height: 1.5 !important;
}
.block {
	display: block !important;
}

/* Focus states */
.focus\:outline-none:focus {
	outline: none !important;
}
.focus\:shadow-outline:focus {
	box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5) !important;
}

/* Hover states */
.hover\:bg-blue-700:hover {
	background-color: #2c5aa0 !important;
}
.hover\:text-gray-400:hover {
	color: #cbd5e0 !important;
}

/* Font weight */
.font-bold {
	font-weight: 700 !important;
}
.font-semibold {
	font-weight: 600 !important;
}

/* Text size */
.text-sm {
	font-size: 0.875rem !important;
}

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

/* XL responsive width classes */
@media (min-width: 1200px) {
	.xl\:w-4\/12 {
		width: 33.333333% !important;
	}
	.xl\:w-8\/12 {
		width: 66.666667% !important;
	}
	.xl\:mb-0 {
		margin-bottom: 0 !important;
	}
}

/* MD responsive classes */
@media (min-width: 768px) {
	.md\:px-10 {
		padding-left: 2.5rem !important;
		padding-right: 2.5rem !important;
	}
	.md\:pt-32 {
		padding-top: 8rem !important;
	}
	.md\:justify-between {
		justify-content: space-between !important;
	}
	.md\:w-4\/12 {
		width: 33.333333% !important;
	}
	.md\:w-8\/12 {
		width: 66.666667% !important;
	}
}

/* Display none for small screens */
.d-sm-none {
	display: none !important;
}
@media (min-width: 576px) {
	.d-sm-none {
		display: initial !important;
	}
}

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

/* List styles */
.list-none {
	list-style: none !important;
}

/* HR border */
.border-b-1 {
	border-bottom: 1px solid !important;
}

/* Text alignment */
.text-center {
	text-align: center !important;
}