/* ============================================
   MASONRY CARDS - MOBILE ONLY
   تمام استایل‌های این فایل فقط در موبایل اعمال می‌شود
   ============================================ */

@media only screen and (max-width: 768px) {
    
    /* ریست کامل Container */
    .elementor-widget-container {
        padding: 0 !important;
        margin: 0 !important;
    }

    .mcw-container {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 12px !important;
        box-sizing: border-box !important;
    }

    /* Grid به Flex تبدیل می‌شود */
    .mcw-masonry-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 18px !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        grid-template-columns: unset !important;
        grid-auto-rows: unset !important;
        grid-template-rows: unset !important;
    }

    /* ریست کامل تمام Span Classes */
    .mcw-card.mcw-span-2x2,
    .mcw-card.mcw-span-2x1,
    .mcw-card.mcw-span-1x2,
    .mcw-card.mcw-span-1x1 {
        grid-column: unset !important;
        grid-row: unset !important;
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 0 !important;
    }

    /* استایل پایه کارت موبایل */
    .mcw-card {
        position: relative !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !important;
        height: auto !important;
        min-height: unset !important;
        max-height: unset !important;
        padding: 24px !important;
        margin: 0 !important;
        border-radius: 20px !important;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1) !important;
        overflow: hidden !important;
        cursor: pointer !important;
        transition: transform 0.2s ease !important;
        animation: none !important;
    }

    /* غیرفعال کردن Hover */
    .mcw-card:hover {
        transform: none !important;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1) !important;
    }

    .mcw-card:active {
        transform: scale(0.98) !important;
    }

    /* غیرفعال کردن Pseudo Elements */
    .mcw-card::before,
    .mcw-card::after {
        content: none !important;
        display: none !important;
    }

    .mcw-card:hover .mcw-card-logo {
        transform: none !important;
        background: none !important;
    }

    /* لینک کارت */
    .mcw-card-link {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        z-index: 10 !important;
        min-height: 48px !important;
        min-width: 48px !important;
    }

    /* لوگو موبایل */
    .mcw-card-logo {
        width: 80px !important;
        height: 80px !important;
        min-width: 80px !important;
        min-height: 80px !important;
        max-width: 80px !important;
        max-height: 80px !important;
        flex-shrink: 0 !important;
        margin: 0 auto 18px auto !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: none !important;
        transform: none !important;
    }

    .mcw-card-logo img {
        width: 80px !important;
        height: 80px !important;
        min-width: 80px !important;
        min-height: 80px !important;
        max-width: 80px !important;
        max-height: 80px !important;
        object-fit: cover !important;
        border-radius: 16px !important;
        display: block !important;
    }

    /* Content Wrapper */
    .mcw-card-content {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 0 !important;
        text-align: center !important;
    }

    /* عنوان موبایل */
    .mcw-card-title {
        width: 100% !important;
        font-size: 17px !important;
        line-height: 1.5 !important;
        font-weight: 700 !important;
        color: white !important;
        text-align: center !important;
        margin: 0 0 12px 0 !important;
        padding: 0 !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        hyphens: auto !important;
        text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
        z-index: 1 !important;
        position: relative !important;
    }

    /* توضیحات موبایل */
    .mcw-card-description {
        width: 100% !important;
        font-size: 14px !important;
        line-height: 1.7 !important;
        color: white !important;
        opacity: 0.95 !important;
        text-align: center !important;
        margin: 0 0 18px 0 !important;
        padding: 0 !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        hyphens: auto !important;
        text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
        z-index: 1 !important;
        position: relative !important;
    }

    /* تگ موبایل */
    .mcw-card-tag {
        position: static !important;
        width: calc(100% + 48px) !important;
        max-width: calc(100% + 48px) !important;
        height: auto !important;
        margin: auto -24px -24px -24px !important;
        padding: 14px 20px !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        line-height: 1.4 !important;
        color: white !important;
        opacity: 1 !important;
        text-align: center !important;
        border-top: 1px solid rgba(255, 255, 255, 0.25) !important;
        border-radius: 0 0 20px 20px !important;
        background: rgba(255, 255, 255, 0.15) !important;
        backdrop-filter: blur(10px) !important;
        text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
        z-index: 1 !important;
        bottom: unset !important;
        left: unset !important;
        right: unset !important;
        top: unset !important;
        transform: none !important;
    }

    /* استایل ویژه 2x1 در موبایل */
    .mcw-span-2x1 {
        flex-direction: column !important;
        align-items: center !important;
        gap: 0 !important;
    }

    .mcw-span-2x1 .mcw-card-logo {
        width: 80px !important;
        height: 80px !important;
        margin: 0 auto 18px auto !important;
    }

    .mcw-span-2x1 .mcw-card-content {
        width: 100% !important;
        text-align: center !important;
    }

    .mcw-span-2x1 .mcw-card-title,
    .mcw-span-2x1 .mcw-card-description {
        text-align: center !important;
    }

    .mcw-span-2x1 .mcw-card-tag {
        position: static !important;
        width: calc(100% + 48px) !important;
        margin: auto -24px -24px -24px !important;
        padding: 14px 20px !important;
        border-radius: 0 0 20px 20px !important;
        bottom: unset !important;
        left: unset !important;
        right: unset !important;
    }

    /* RTL Support در موبایل */
    [dir="rtl"] .mcw-span-2x1,
    [dir="rtl"] .mcw-card {
        flex-direction: column !important;
    }

    [dir="rtl"] .mcw-card-content,
    [dir="rtl"] .mcw-card-title,
    [dir="rtl"] .mcw-card-description {
        text-align: center !important;
    }

    [dir="rtl"] .mcw-card-tag {
        text-align: center !important;
        left: unset !important;
        right: unset !important;
    }
}

/* موبایل کوچک (480px و کمتر) */
@media only screen and (max-width: 480px) {
    .mcw-container {
        padding: 10px !important;
    }

    .mcw-masonry-grid {
        gap: 16px !important;
    }

    .mcw-card {
        padding: 22px !important;
        border-radius: 18px !important;
    }

    .mcw-card-logo,
    .mcw-card-logo img,
    .mcw-span-2x1 .mcw-card-logo {
        width: 70px !important;
        height: 70px !important;
        min-width: 70px !important;
        min-height: 70px !important;
        max-width: 70px !important;
        max-height: 70px !important;
        border-radius: 14px !important;
        margin-bottom: 16px !important;
    }

    .mcw-card-title {
        font-size: 16px !important;
        margin-bottom: 10px !important;
    }

    .mcw-card-description {
        font-size: 13px !important;
        line-height: 1.6 !important;
        margin-bottom: 16px !important;
    }

    .mcw-card-tag,
    .mcw-span-2x1 .mcw-card-tag {
        width: calc(100% + 44px) !important;
        margin: auto -22px -22px -22px !important;
        padding: 12px 18px !important;
        font-size: 12px !important;
        border-radius: 0 0 18px 18px !important;
    }
}

/* موبایل خیلی کوچک (360px و کمتر) */
@media only screen and (max-width: 360px) {
    .mcw-container {
        padding: 8px !important;
    }

    .mcw-masonry-grid {
        gap: 14px !important;
    }

    .mcw-card {
        padding: 20px !important;
        border-radius: 16px !important;
    }

    .mcw-card-logo,
    .mcw-card-logo img,
    .mcw-span-2x1 .mcw-card-logo {
        width: 60px !important;
        height: 60px !important;
        min-width: 60px !important;
        min-height: 60px !important;
        max-width: 60px !important;
        max-height: 60px !important;
        border-radius: 12px !important;
        margin-bottom: 14px !important;
    }

    .mcw-card-title {
        font-size: 15px !important;
        margin-bottom: 8px !important;
    }

    .mcw-card-description {
        font-size: 12px !important;
        line-height: 1.5 !important;
        margin-bottom: 14px !important;
    }

    .mcw-card-tag,
    .mcw-span-2x1 .mcw-card-tag {
        width: calc(100% + 40px) !important;
        margin: auto -20px -20px -20px !important;
        padding: 10px 16px !important;
        font-size: 11px !important;
        border-radius: 0 0 16px 16px !important;
    }
}