/*
 * Safari/iOS Compatibility Fixes
 * إصلاحات التوافق مع Safari و iOS
 */

/* =========================================
   1. Text Gradient Fix (background-clip: text)
   ========================================= */

/* إصلاح gradient على النصوص */
.bg-clip-text,
[class*="bg-clip-text"] {
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}

/* Fallback للمتصفحات القديمة */
@supports not (-webkit-background-clip: text) {
    .bg-clip-text,
    [class*="bg-clip-text"] {
        -webkit-text-fill-color: inherit;
        text-fill-color: inherit;
        color: inherit;
    }
}

/* =========================================
   2. Backdrop Filter Fix
   ========================================= */

/* إصلاح backdrop-filter */
.backdrop-blur,
.backdrop-blur-sm,
.backdrop-blur-md,
.backdrop-blur-lg,
[class*="backdrop-blur"] {
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.backdrop-blur-sm {
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

.backdrop-blur-md {
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.backdrop-blur-lg {
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}

/* Fallback للمتصفحات التي لا تدعم backdrop-filter */
@supports not (backdrop-filter: blur(8px)) {
    .backdrop-blur,
    .backdrop-blur-sm,
    .backdrop-blur-md,
    .backdrop-blur-lg,
    [class*="backdrop-blur"] {
        background-color: rgba(0, 0, 0, 0.3) !important;
    }
}

/* =========================================
   3. Gradient Fix
   ========================================= */

/* إصلاح gradients للتأكد من ظهورها بشكل صحيح */
.bg-gradient-to-r,
.bg-gradient-to-l,
.bg-gradient-to-t,
.bg-gradient-to-b,
.bg-gradient-to-br,
.bg-gradient-to-bl,
[class*="bg-gradient"] {
    background-image: -webkit-linear-gradient(left, var(--tw-gradient-stops));
    background-image: linear-gradient(to right, var(--tw-gradient-stops));
}

/* Safari-specific gradient fixes */
@supports (-webkit-appearance: none) {
    .bg-gradient-to-r {
        background-image: -webkit-gradient(linear, left top, right top, from(var(--tw-gradient-from)), to(var(--tw-gradient-to)));
        background-image: -webkit-linear-gradient(left, var(--tw-gradient-from), var(--tw-gradient-to));
        background-image: linear-gradient(to right, var(--tw-gradient-from), var(--tw-gradient-to));
    }

    .bg-gradient-to-l {
        background-image: -webkit-gradient(linear, right top, left top, from(var(--tw-gradient-from)), to(var(--tw-gradient-to)));
        background-image: -webkit-linear-gradient(right, var(--tw-gradient-from), var(--tw-gradient-to));
        background-image: linear-gradient(to left, var(--tw-gradient-from), var(--tw-gradient-to));
    }
}

/* Fallback لـ gradients المعقدة */
@supports not (background: linear-gradient(to right, #000, #fff)) {
    .bg-gradient-to-r,
    .bg-gradient-to-l,
    .bg-gradient-to-t,
    .bg-gradient-to-b,
    [class*="bg-gradient"] {
        background-color: var(--tw-gradient-from, #2563eb);
    }
}

/* =========================================
   4. إصلاحات إضافية لـ Safari/iOS
   ========================================= */

/* تحسين rendering على Safari */
* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* إصلاح scroll سلس على iOS */
html {
    -webkit-overflow-scrolling: touch;
}

/* إصلاح sticky position على Safari */
.sticky {
    position: -webkit-sticky !important;
    position: sticky !important;
}

/* منع zoom على input في iOS */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="url"],
select,
textarea {
    font-size: 16px !important;
}

/* إصلاح tap highlight على iOS */
* {
    -webkit-tap-highlight-color: transparent;
}

a, button {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
}

/* =========================================
   5. إصلاحات خاصة بأجهزة Apple (Safari/iOS)
   ========================================= */

/* إصلاح مشكلة عدم ظهور المحتوى على Safari/iOS */
@supports (-webkit-touch-callout: none) {
    /* ضمان ظهور جميع العناصر */
    * {
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* إصلاح مشاكل العرض على iOS */
    body, html {
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
        text-size-adjust: 100%;
        display: block !important;
        visibility: visible !important;
    }

    /* إصلاح مشاكل الصور */
    img {
        display: block !important;
        max-width: 100% !important;
        height: auto !important;
        -webkit-user-select: none;
        user-select: none;
    }

    /* إصلاح مشاكل النصوص */
    h1, h2, h3, h4, h5, h6, p, span, div, a, li {
        display: block !important;
        visibility: visible !important;
        color: inherit !important;
    }

    /* إصلاح مشاكل الأقسام */
    section {
        display: block !important;
        visibility: visible !important;
        position: relative !important;
    }

    /* إصلاح مشاكل الـ containers */
    .container, .container-fluid, .max-w-7xl, .max-w-6xl, .max-w-4xl {
        display: block !important;
        visibility: visible !important;
        width: 100% !important;
    }

    /* إصلاح مشاكل الـ flexbox */
    .flex {
        display: -webkit-box !important;
        display: -webkit-flex !important;
        display: flex !important;
    }

    /* إصلاح مشاكل الـ grid */
    .grid {
        display: -webkit-grid !important;
        display: grid !important;
    }
}

/* إصلاحات خاصة لـ Safari على macOS */
@supports (-webkit-appearance: none) and (not (-webkit-touch-callout: none)) {
    /* macOS Safari specific fixes */
    body {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

/* إصلاح مشاكل الـ z-index على iOS */
@supports (-webkit-touch-callout: none) {
    .relative {
        position: relative !important;
        z-index: auto !important;
    }

    .absolute {
        position: absolute !important;
    }

    .fixed {
        position: fixed !important;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}

/* إصلاح مشاكل الـ transform على iOS */
@supports (-webkit-touch-callout: none) {
    [class*="transform"],
    [class*="translate"],
    [class*="scale"],
    [class*="rotate"] {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        will-change: transform;
    }
}

/* إصلاح مشاكل الـ animations على iOS */
@supports (-webkit-touch-callout: none) {
    @keyframes fadeInUp {
        from {
            opacity: 0;
            -webkit-transform: translate3d(0, 30px, 0);
            transform: translate3d(0, 30px, 0);
        }
        to {
            opacity: 1;
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
        }
    }

    .animate-fade-in-up {
        -webkit-animation: fadeInUp 0.8s ease-out forwards;
        animation: fadeInUp 0.8s ease-out forwards;
    }
}

/* إصلاح مشاكل الـ overflow على iOS */
@supports (-webkit-touch-callout: none) {
    .overflow-hidden {
        overflow: hidden !important;
        -webkit-overflow-scrolling: touch;
    }

    .overflow-x-hidden {
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch;
    }
}

/* إصلاح مشاكل الـ visibility على iOS */
@supports (-webkit-touch-callout: none) {
    .hidden {
        display: none !important;
    }

    /* ضمان ظهور العناصر المرئية */
    :not(.hidden) {
        visibility: visible !important;
    }
}