/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #f0f9ff;
}

::-webkit-scrollbar-thumb {
    background: #007cc3;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #005f94;
}

/* Animation Utility Classes */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s ease-out;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* Glassmorphism */
.glass {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
}

/* Water Wave Animation */
.waves {
    position: relative;
    width: 100%;
    height: 15vh;
    margin-bottom: -7px;
    min-height: 100px;
    max-height: 150px;
}

.parallax > use {
    animation: move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite;
}

.parallax > use:nth-child(1) {
    animation-delay: -2s;
    animation-duration: 7s;
}

.parallax > use:nth-child(2) {
    animation-delay: -3s;
    animation-duration: 10s;
}

.parallax > use:nth-child(3) {
    animation-delay: -4s;
    animation-duration: 13s;
}

.parallax > use:nth-child(4) {
    animation-delay: -5s;
    animation-duration: 20s;
}

@keyframes move-forever {
    0% { 
        transform: translate3d(-90px,0,0); 
    }
    100% { 
        transform: translate3d(85px,0,0); 
    }
}

/* RTL/LTR Support */
[dir="rtl"] .fa-arrow-left {
    transform: rotate(180deg);
}

[dir="ltr"] .fa-arrow-left {
    transform: rotate(0deg);
}

/* Smooth language transition */
html {
    transition: direction 0.3s ease;
}

/* Font display optimization */
@font-face {
    font-family: 'Cairo';
    font-display: swap;
}

@font-face {
    font-family: 'Aref Ruqaa';
    font-display: swap;
}

/* Optimize image rendering */
img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

/* Reduce layout shift for images */
img[loading="lazy"] {
    content-visibility: auto;
}
