/* --- التنسيقات المخصصة (Custom CSS) --- */
body {
    font-family: 'Poppins', sans-serif; /* Switched to Poppins */
    background-color: #f9fafb;
    color: #1f2937;
}

.hero-video {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: translate(-50%, -50%);
    z-index: -1;
}

.hero-overlay {
    background-color: rgba(255, 255, 255, 0.7);
    background-image: linear-gradient(to right, rgba(0, 128, 128, 0.01), rgba(255, 153, 0, 0.01));
}

.form-container {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

/* تعريف الألوان الأساسية للموقع بناءً على ألوان الشعار */
.bg-primary {
    background-color: #008080;
}

.text-primary {
    color: #008080;
}

.hover-bg-primary:hover {
    background-color: #006666;
}

.bg-secondary {
    background-color: #FF9900;
}

.text-secondary {
    color: #FF9900;
}

.hover-bg-secondary:hover {
    background-color: #E68A00;
}

.border-primary {
    border-color: #008080;
}

.focus-ring-primary:focus {
    --tw-ring-color: #008080;
}

.focus-border-primary:focus {
    border-color: #008080;
}

/* تنسيقات خاصة بالوضع الفاتح (Light Mode) لضمان وضوح العناصر */
.navbar-light {
    background-color: #f3f4f6;
    color: #1f2937;
}

    .navbar-light .text-white {
        color: #1f2937;
    }

    .navbar-light .hover-text-secondary:hover {
        color: #FF9900;
    }

.mobile-menu-light {
    background-color: #e5e7eb;
}

.form-input-light {
    background-color: #ffffff;
    color: #1f2937;
    border-color: #d1d5db;
}

.feature-card-light {
    background-color: #ffffff;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    color: #1f2937;
}

.footer-light {
    background-color: #e5e7eb;
    color: #4b5563;
}

.text-gray-200 {
    color: #374151;
}

.text-gray-300 {
    color: #4b5563;
}

.text-gray-400 {
    color: #6b7280;
}

/* تنسيقات خاصة بالرسوم المتحركة (Animation) لنافذة النجاح المنبثقة */
.checkmark__circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke: #008080; /* primary color */
    fill: none;
    animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.checkmark {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: block;
    stroke-width: 3;
    stroke: #fff;
    stroke-miterlimit: 10;
    margin: 0 auto 1rem auto;
    box-shadow: inset 0px 0px 0px #008080;
    animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}

.checkmark__check {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

@keyframes stroke {
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes scale {
    0%, 100% {
        transform: none;
    }

    50% {
        transform: scale3d(1.1, 1.1, 1);
    }
}

@keyframes fill {
    100% {
        box-shadow: inset 0px 0px 0px 40px #008080;
    }
}