﻿/*@keyframes fly-right {
    0% {
        transform: translateX(0) translateY(0);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    25% {
        transform: translateX(calc(25vw)) translateY(5vh);
    }

    50% {
        transform: translateX(calc(50vw)) translateY(-5vh);
    }

    75% {
        transform: translateX(calc(75vw)) translateY(10vh);
    }

    95% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(calc(100vw + 120px)) translateY(0);
        opacity: 0;
    }
}

@keyframes fly-left {
    0% {
        transform: translateX(0) translateY(0) rotate(180deg);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    25% {
        transform: translateX(calc(-25vw)) translateY(-5vh) rotate(180deg);
    }

    50% {
        transform: translateX(calc(-50vw)) translateY(5vh) rotate(180deg);
    }

    75% {
        transform: translateX(calc(-75vw)) translateY(-10vh) rotate(180deg);
    }

    95% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(calc(-100vw - 100px)) translateY(0) rotate(180deg);
        opacity: 0;
    }
}

@keyframes fly-diagonal {
    0% {
        transform: translateX(0) translateY(0) rotate(-15deg);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(calc(100vw + 90px)) translateY(-40vh) rotate(-15deg);
        opacity: 0;
    }
}

@keyframes helicopter-path {
    0% {
        transform: translateX(0) translateY(0);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    20% {
        transform: translateX(20vw) translateY(5vh);
    }

    25% {
        transform: translateX(25vw) translateY(5vh);
    }

    30% {
        transform: translateX(25vw) translateY(5vh);
    }

    50% {
        transform: translateX(50vw) translateY(-10vh);
    }

    55% {
        transform: translateX(50vw) translateY(-10vh);
    }

    60% {
        transform: translateX(50vw) translateY(-10vh);
    }

    80% {
        transform: translateX(75vw) translateY(15vh);
    }

    85% {
        transform: translateX(75vw) translateY(15vh);
    }

    95% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(100vw) translateY(0);
        opacity: 0;
    }
}
@keyframes rotate-rotor {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}
@media (max-width: 992px) {
    .login-area {
        padding-left: 3%;
    }

    .animated-aircraft {
        opacity: 0.5;
    }

    .aircraft-1::after,
    .aircraft-2::after,
    .aircraft-3::after {
        width: 30px;
    }
}

@media (max-width: 768px) {
    .login-area {
        padding-left: 0%;*/
       /* padding-top: 10%;*/
        /*justify-content: center;*/ /* Center on mobile */
    /*}

    .aircraft-1, .aircraft-2 {
        width: 80px;
        height: 40px;
    }

    .helicopter {
        width: 60px;
        height: 40px;
    }

    .aircraft-3 {
        display: none;*/ /* Hide third aircraft on smaller screens */
    /*}
}*/

/* Reduced motion preference */
/*@media (prefers-reduced-motion: reduce) {
    .animated-aircraft {
        animation: none !important;
        opacity: 0.3;
        transform: none !important;
    }

    .aircraft-1 {
        top: 15%;
        left: 70%;
    }

    .aircraft-2 {
        top: 40%;
        left: 20%;
    }

    .helicopter {
        top: 25%;
        left: 50%;
    }

    .helicopter-rotor,
    .helicopter-tail-rotor {
        animation: rotate-rotor 1s linear infinite !important;*/ /* Slower rotation */
    /*}
}
@keyframes panelPop {
    0% {
        transform: translateY(-60%) scale(0.95);
        opacity: 0;
    }

    100% {
        transform: translateY(-50%) scale(1);
        opacity: 1;
    }
}
@media (max-width: 991px) {
    .login-body {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2rem;
    }

    .login-container {
        margin-left: 0;
    }

    .custom-side-menu {
        display: none;
    }
}*/
/* Animation keyframes for aircraft */
/*@keyframes fly-right {
    0% {
        transform: translateX(0) translateY(0);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    25% {
        transform: translateX(calc(25vw)) translateY(5vh);
    }

    50% {
        transform: translateX(calc(50vw)) translateY(-5vh);
    }

    75% {
        transform: translateX(calc(75vw)) translateY(10vh);
    }

    95% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(calc(100vw + 120px)) translateY(0);
        opacity: 0;
    }
}

@keyframes fly-left {
    0% {
        transform: translateX(0) translateY(0) rotate(180deg);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    25% {
        transform: translateX(calc(-25vw)) translateY(-5vh) rotate(180deg);
    }

    50% {
        transform: translateX(calc(-50vw)) translateY(5vh) rotate(180deg);
    }

    75% {
        transform: translateX(calc(-75vw)) translateY(-10vh) rotate(180deg);
    }

    95% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(calc(-100vw - 100px)) translateY(0) rotate(180deg);
        opacity: 0;
    }
}

@keyframes fly-diagonal {
    0% {
        transform: translateX(0) translateY(0) rotate(-15deg);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(calc(100vw + 90px)) translateY(-40vh) rotate(-15deg);
        opacity: 0;
    }
}

@keyframes helicopter-path {
    0% {
        transform: translateX(0) translateY(0);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    20% {
        transform: translateX(20vw) translateY(5vh);
    }

    25% {
        transform: translateX(25vw) translateY(5vh);
    }

    30% {
        transform: translateX(25vw) translateY(5vh);
    }

    50% {
        transform: translateX(50vw) translateY(-10vh);
    }

    55% {
        transform: translateX(50vw) translateY(-10vh);
    }

    60% {
        transform: translateX(50vw) translateY(-10vh);
    }

    80% {
        transform: translateX(75vw) translateY(15vh);
    }

    85% {
        transform: translateX(75vw) translateY(15vh);
    }

    95% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(100vw) translateY(0);
        opacity: 0;
    }
}
@keyframes rotate-rotor {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}*/
/* Responsive adjustments */
/*@media (max-width: 992px) {
    .login-area {
        padding-left: 3%;
    }

    .animated-aircraft {
        opacity: 0.5;
    }

    .aircraft-1::after,
    .aircraft-2::after,
    .aircraft-3::after {
        width: 30px;
    }
}

@media (max-width: 768px) {
    .login-area {
        padding-left: 0;
        padding-right:0;
            justify-content: center;*/ /* Center on mobile */
    /*}

    .aircraft-1, .aircraft-2 {
        width: 80px;
        height: 40px;
    }

    .helicopter {
        width: 60px;
        height: 40px;
    }

    .aircraft-3 {
        display: none;*/ /* Hide third aircraft on smaller screens */
    /*}
}*/

/* Reduced motion preference */
/*@media (prefers-reduced-motion: reduce) {
    .animated-aircraft {
        animation: none !important;
        opacity: 0.3;
        transform: none !important;
    }

    .aircraft-1 {
        top: 15%;
        left: 70%;
    }

    .aircraft-2 {
        top: 40%;
        left: 20%;
    }

    .helicopter {
        top: 25%;
        left: 50%;
    }

    .helicopter-rotor,
    .helicopter-tail-rotor {
        animation: rotate-rotor 1s linear infinite !important;*/ /* Slower rotation */
    /*}
}

@keyframes fly-right {
    0% {
        transform: translateX(0) translateY(0);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    95% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(calc(100vw + 120px)) translateY(0);
        opacity: 0;
    }
}

@keyframes fly-left {
    0% {
        transform: translateX(0) translateY(0) rotate(180deg);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    95% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(calc(-100vw - 100px)) translateY(0) rotate(180deg);
        opacity: 0;
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}*/

/* تحسينات للتجاوب */
/*@media (max-width: 768px) {
    .hero-title {
        font-size: 2.5rem;
    }

    .hero-subtitle {
        font-size: 1.2rem;
    }

    .section-title {
        font-size: 2rem;
    }

    .cta-title {
        font-size: 2rem;
    }
}*/

/* Animation Keyframes */
/*@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translateX(30px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fly-right {
    0% {
        transform: translateX(0) translateY(0);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    25% {
        transform: translateX(calc(25vw)) translateY(5vh);
    }

    50% {
        transform: translateX(calc(50vw)) translateY(-5vh);
    }

    75% {
        transform: translateX(calc(75vw)) translateY(10vh);
    }

    95% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(calc(100vw + 120px)) translateY(0);
        opacity: 0;
    }
}

@keyframes fly-left {
    0% {
        transform: translateX(0) translateY(0) rotate(180deg);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    25% {
        transform: translateX(calc(-25vw)) translateY(-5vh) rotate(180deg);
    }

    50% {
        transform: translateX(calc(-50vw)) translateY(5vh) rotate(180deg);
    }

    75% {
        transform: translateX(calc(-75vw)) translateY(-10vh) rotate(180deg);
    }

    95% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(calc(-100vw - 100px)) translateY(0) rotate(180deg);
        opacity: 0;
    }
}

@keyframes fly-diagonal {
    0% {
        transform: translateX(0) translateY(0) rotate(-15deg);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(calc(100vw + 90px)) translateY(-40vh) rotate(-15deg);
        opacity: 0;
    }
}

@keyframes helicopter-path {
    0% {
        transform: translateX(0) translateY(0);
        opacity: 0;
    }

    5% {
        opacity: 0.7;
    }

    20% {
        transform: translateX(20vw) translateY(5vh);
    }

    25% {
        transform: translateX(25vw) translateY(5vh);
    }

    30% {
        transform: translateX(25vw) translateY(5vh);
    }

    50% {
        transform: translateX(50vw) translateY(-10vh);
    }

    55% {
        transform: translateX(50vw) translateY(-10vh);
    }

    60% {
        transform: translateX(50vw) translateY(-10vh);
    }

    80% {
        transform: translateX(75vw) translateY(15vh);
    }

    85% {
        transform: translateX(75vw) translateY(15vh);
    }

    95% {
        opacity: 0.7;
    }

    100% {
        transform: translateX(100vw) translateY(0);
        opacity: 0;
    }
}

@keyframes rotate-rotor {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}*/

/* Responsive Styles */
/*@media (max-width: 1200px) {
    .main-content-wrapper {
        flex-direction: column;
        align-items: center;
        padding: 0 10px;
    }

    .marketing-section {
        margin-right: 0;
        margin-bottom: 30px;
        max-width: 800px;
        padding: 20px;
    }

    .login-area {
        justify-content: center;
        padding-right: 0;
        width: 100%;
        margin-bottom: 40px;
    }
}

@media (max-width: 768px) {
    .project-title {
        font-size: 2.2rem;
    }

    #motivational-text {
        font-size: 0.95rem;
        padding: 0 10px;
    }

    .marketing-title {
        font-size: 1.8rem;
    }

    .marketing-text {
        font-size: 1rem;
    }

    .feature-item {
        padding: 12px;
    }

    .feature-icon {
        font-size: 1.5rem;
        margin-right: 10px;
    }

    .feature-text {
        font-size: 0.9rem;
    }

    .login-card {
        max-width: 350px;
    }

    .fixed-side-menu {
        top: auto;
        bottom: 0;
        right: 0;
        left: 0;
        transform: none;
        display: flex;
        justify-content: space-around;
        border-radius: 10px 10px 0 0;
        padding: 10px;
    }

    .side-menu-item {
        flex-direction: column;
        padding: 8px;
        margin-bottom: 0;
    }

        .side-menu-item i {
            margin-right: 0;
            margin-bottom: 5px;
        }

        .side-menu-item span {
            font-size: 0.8rem;
        }

    .info-panel {
        width: 95%;
    }
}

@media (max-width: 480px) {
    .project-title {
        font-size: 1.8rem;
    }

    .marketing-section {
        padding: 15px;
    }

    .marketing-title {
        font-size: 1.5rem;
    }

    .login-card {
        max-width: 100%;
    }

    .panel-header h3 {
        font-size: 1.3rem;
    }
}*/

/* Reduced Motion Preference */
/*@media (prefers-reduced-motion: reduce) {
    .animated-aircraft {
        animation: none !important;
        opacity: 0.3;
        transform: none !important;
    }

    .aircraft-1 {
        top: 15%;
        left: 70%;
    }

    .aircraft-2 {
        top: 40%;
        left: 20%;
    }

    .helicopter {
        top: 25%;
        left: 50%;
    }

    .helicopter-rotor,
    .helicopter-tail-rotor {
        animation: rotate-rotor 1s linear infinite !important;
    }

    .marketing-section,
    .login-area,
    #motivational-text,
    .project-title,
    .login-card:hover {
        animation: none !important;
        transform: none !important;
    }
}*/
/* Simple Animation Keyframes */
/*@keyframes fly-across {
    0% {
        transform: translateX(0);
        opacity: 0;
    }

    10% {
        opacity: 0.6;
    }

    90% {
        opacity: 0.6;
    }

    100% {
        transform: translateX(calc(100vw + 100px));
        opacity: 0;
    }
}

@keyframes fly-back {
    0% {
        transform: translateX(0) rotate(180deg);
        opacity: 0;
    }

    10% {
        opacity: 0.6;
    }

    90% {
        opacity: 0.6;
    }

    100% {
        transform: translateX(calc(-100vw - 80px)) rotate(180deg);
        opacity: 0;
    }
}*/

/* Responsive Styles */
/*@media (max-width: 1100px) {
    .content-wrapper {
        flex-direction: column;
        align-items: center;
        padding: 0 10px;
    }

    .info-section {
        margin-right: 0;
        margin-bottom: 30px;
        max-width: 700px;
        padding: 15px;
    }

    .login-area {
        justify-content: center;
        padding-right: 0;
        width: 100%;
        margin-bottom: 40px;
    }
}

@media (max-width: 768px) {
    .main-title {
        font-size: 2rem;
    }

    .header-text {
        font-size: 0.95rem;
        padding: 0 10px;
    }

    .info-title {
        font-size: 1.7rem;
    }

    .info-text {
        font-size: 1rem;
    }

    .feature {
        padding: 10px;
    }

    .feature-icon {
        font-size: 1.3rem;
        margin-right: 8px;
    }

    .feature-text {
        font-size: 0.9rem;
    }

    .side-menu {
        top: auto;
        bottom: 0;
        right: 0;
        left: 0;
        transform: none;
        display: flex;
        justify-content: space-around;
        border-radius: 8px 8px 0 0;
        padding: 8px;
    }

    .menu-item {
        flex-direction: column;
        padding: 8px;
        margin-bottom: 0;
    }

        .menu-item i {
            margin-right: 0;
            margin-bottom: 5px;
        }

        .menu-item span {
            font-size: 0.8rem;
        }
}

@media (max-width: 480px) {
    .main-title {
        font-size: 1.7rem;
    }

    .info-section {
        padding: 12px;
    }

    .info-title {
        font-size: 1.4rem;
    }

    .login-card {
        max-width: 100%;
    }

    .panel-header h3 {
        font-size: 1.2rem;
    }
}*/

/* Reduced Motion */
/*@media (prefers-reduced-motion: reduce) {
    .aircraft {
        animation: none !important;
        opacity: 0.3;
        transform: none !important;
    }

    .plane-1 {
        top: 15%;
        left: 70%;
    }

    .plane-2 {
        top: 40%;
        left: 20%;
    }
}*/