/*!
 * Tailwind to Bootstrap 5 Migration Utilities
 * Custom CSS for Tailwind utilities that don't have direct Bootstrap 5 equivalents
 * Phoenix International Logistics Platform
 */

/* High z-index values */
.z-20 { z-index: 20 !important; }
.z-30 { z-index: 30 !important; }

/* Transform utilities */
.translate-x-0 { transform: translateX(0) !important; }
.-translate-x-full { transform: translateX(-100%) !important; }
.transform { transform: translateX(var(--tw-translate-x, 0)) translateY(var(--tw-translate-y, 0)) rotate(var(--tw-rotate, 0)) skewX(var(--tw-skew-x, 0)) skewY(var(--tw-skew-y, 0)) scaleX(var(--tw-scale-x, 1)) scaleY(var(--tw-scale-y, 1)) !important; }

/* Responsive transforms */
@media (min-width: 992px) {
    .lg\:translate-x-0 { transform: translateX(0) !important; }
    .lg\:static { position: static !important; }
}

/* Transition utilities */
.transition-opacity { transition-property: opacity !important; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important; transition-duration: 150ms !important; }
.duration-300 { transition-duration: 300ms !important; }
.ease-out { transition-timing-function: cubic-bezier(0, 0, 0.2, 1) !important; }
.ease-in { transition-timing-function: cubic-bezier(0.4, 0, 1, 1) !important; }

/* Specific dimensions */
.w-64 { width: 16rem !important; }
.w-5 { width: 1.25rem !important; }
.h-5 { height: 1.25rem !important; }
.w-6 { width: 1.5rem !important; }
.h-6 { height: 1.5rem !important; }
.h-screen { height: 100vh !important; }

/* Positioning utilities */
.inset-0 { top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important; }
.inset-y-0 { top: 0 !important; bottom: 0 !important; }
.left-0 { left: 0 !important; }

/* Color utilities */
.border-indigo-600 { border-color: #4f46e5 !important; }
.bg-gray-100 { background-color: #f3f4f6 !important; }
.bg-gray-200 { background-color: #e5e7eb !important; }
.bg-gray-500 { background-color: #6b7280 !important; }
.bg-gray-700 { background-color: #374151 !important; }
.bg-gray-800 { background-color: #1f2937 !important; }
.text-gray-100 { color: #f3f4f6 !important; }
.text-gray-500 { color: #6b7280 !important; }

/* Focus utilities */
.focus\:outline-none:focus { outline: 2px solid transparent !important; outline-offset: 2px !important; }

/* Responsive display utilities */
@media (min-width: 992px) {
    .lg\:hidden { display: none !important; }
}

/* Spacing utilities that don't match Bootstrap exactly */
.mt-10 { margin-top: 2.5rem !important; }
.px-6 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
.py-8 { padding-top: 2rem !important; padding-bottom: 2rem !important; }

/* Border utilities */
.border-b-4 { border-bottom-width: 4px !important; border-bottom-style: solid !important; }

/* Flexbox utilities */
.flex-1 { flex: 1 1 0% !important; }

/* Overflow utilities */
.overflow-x-hidden { overflow-x: hidden !important; }
.overflow-y-auto { overflow-y: auto !important; }