/* Jude Travel - Custom Styles */

/* Hero slider styles */
.hero-slide {
    transition: opacity 1s ease-in-out;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.hero-slide.active {
    opacity: 1 !important;
}

/* Smooth hover effects for slider controls */
.slide-dot {
    transition: all 0.3s ease;
    cursor: pointer;
}

.slide-dot:hover {
    transform: scale(1.2);
}

#prev-slide, #next-slide {
    transition: all 0.3s ease;
    cursor: pointer;
    padding: 15px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(5px);
}

#prev-slide:hover, #next-slide:hover {
    background: rgba(255, 140, 66, 0.7);
    transform: scale(1.1);
}

/* Enhanced text shadows for better readability */
.drop-shadow-2xl {
    text-shadow: 0 0 20px rgba(0, 0, 0, 0.8), 0 0 40px rgba(0, 0, 0, 0.6);
}

.drop-shadow-lg {
    text-shadow: 0 0 15px rgba(0, 0, 0, 0.7);
}

.drop-shadow-md {
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
}

/* Pause slider on hover */
.hero-slider-container:hover .hero-slide {
    animation-play-state: paused;
}

/* Loading animation for images */
.hero-slide {
    background-color: #2B4C7E;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    #prev-slide, #next-slide {
        padding: 10px;
    }
    
    .slide-dot {
        width: 8px;
        height: 8px;
    }
}

/* Smooth background transitions */
.hero-slide {
    will-change: opacity;
    transform: translateZ(0);
}

/* Backdrop blur for better button visibility */
.backdrop-blur {
    backdrop-filter: blur(10px);
}

/* Language Switching Styles */
.lang-switch {
    transition: all 0.3s ease;
    border-radius: 6px;
    font-weight: 500;
}

.lang-switch:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* RTL Support */
[dir="rtl"] .space-x-4 > * + * {
    margin-left: 0;
    margin-right: 1rem;
}

[dir="rtl"] .space-x-6 > * + * {
    margin-left: 0;
    margin-right: 1.5rem;
}

[dir="rtl"] .flex-row-reverse {
    flex-direction: row-reverse;
}

/* Language Content Display */
.lang-hidden {
    display: none !important;
}

/* Force visibility for non-hidden language content */
.lang-ar:not(.lang-hidden) {
    display: inherit !important;
}

.lang-en:not(.lang-hidden) {
    display: inherit !important;
}

/* Smooth transitions for language switching */
.lang-ar, .lang-en {
    transition: opacity 0.3s ease-in-out;
}

/* Direction-specific margin adjustments */
[dir="rtl"] .ml-2 { margin-left: 0; margin-right: 0.5rem; }
[dir="rtl"] .ml-3 { margin-left: 0; margin-right: 0.75rem; }
[dir="rtl"] .ml-4 { margin-left: 0; margin-right: 1rem; }

[dir="ltr"] .mr-2 { margin-right: 0; margin-left: 0.5rem; }
[dir="ltr"] .mr-3 { margin-right: 0; margin-left: 0.75rem; }
[dir="ltr"] .mr-4 { margin-right: 0; margin-left: 1rem; }

/* Language switcher button styling */
.lang-switch.bg-jude-blue {
    background-color: #2B4C7E !important;
    color: white !important;
}

/* Better RTL text alignment */
[dir="rtl"] .text-center {
    text-align: center;
}

[dir="rtl"] .text-left {
    text-align: right;
}

[dir="rtl"] .text-right {
    text-align: left;
}

/* Force grid items to maintain order regardless of direction */
[dir="rtl"] .grid-cols-4 > div:nth-child(1) { order: 1; }
[dir="rtl"] .grid-cols-4 > div:nth-child(2) { order: 2; }  
[dir="rtl"] .grid-cols-4 > div:nth-child(3) { order: 3; }
[dir="rtl"] .grid-cols-4 > div:nth-child(4) { order: 4; }