/*
 Theme Name:   Eduma Child
 Theme URI:    http://educationwp.thimpress.com/
 Description:  Eduma Child Theme
 Author:       ThimPress
 Author URI:   http://thimpress.com
 Template:     eduma
 Version:      1.0.0
 Text Domain:  eduma-child
*/
/*start custome header*/
.site-header .header_full{
	padding-left: 0; 
	padding-right: 0;
}
.site-header.header_v2#masthead .navigation{
	background-color: #ffff;
}
#masthead .navigation .width-logo{
	    text-align: center;
}
.site-header.header_v2 .navigation .menu-mobile-effect.navbar-toggle span.icon-bar{
	        background-color: #124795;
}
.navigation .width-navigation .navbar-nav>li .sub-menu li.current-menu-item>a, .navigation .width-navigation .navbar-nav>li .sub-menu li>a:hover{
	color: #dddedf;
}
/*end custome header*/

/* 1. ضبط الروابط لتغطي الكارت بالكامل دون تغيير التنسيق */
.flip-card-link {
    text-decoration: none !important;
    display: block;
    width: 100%;
}

/* 2. ضبط الحاوية الكبيرة (Columns) لتمتد بعرض الشاشة */
.wp-block-columns {
    display: flex !important;
    flex-direction: row;
    flex-wrap: nowrap;
    width: 100% !important;
    max-width: 100% !important;
    margin: 20px auto !important;
    gap: 20px;
}

/* 3. ضبط العمود لضمان عدم الانكماش */
.wp-block-column {
    flex: 1 !important;
    min-width: 0 !important;
}

/* 4. إعدادات الكارت (Flip Card) */
.flip-card {
    background-color: transparent;
    width: 100%;
    height: 350px; /* تم زيادة الطول لاستيعاب الصورة والنص براحة */
    perspective: 1000px;
}

.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    transform-style: preserve-3d;
}

.flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
}

/* 5. تنسيق أوجه الكارت (الأمامي والخلفي) */
.flip-card-front, .flip-card-back {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border-radius: 12px;
    display: flex;
    flex-direction: column; /* ترتيب العناصر عمودياً */
    justify-content: center;
    align-items: center;
    padding: 20px;
    box-sizing: border-box;
}

/* الوجه الأمامي (الأزرق) */
.flip-card-front {
    background-color: #10438a;
    color: #ffffff;
}

/* الوجه الخلفي (الأسود) */
.flip-card-back {
    background-color: #222;
    color: #ffffff;
    transform: rotateY(180deg);
}

/* 6. تنسيق الأيقونات (الصور) */
.card-icon-container {
    width: 100px; /* حجم حاوية الصورة */
    height: 100px;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom-card-icon {
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* 7. تنسيق النصوص */
.flip-card-front p, .flip-card-back p {
    font-size: 22px !important;
    font-weight: bold !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    color: #ffffff !important;
    text-align: center;
}

/* سهم صغير في الخلف لزيادة التفاعل */
.back-arrow {
    margin-top: 15px;
    font-size: 24px;
    color: #ffffff;
}

/* 8. ريسبونسيف (Responsive) */

/* للتابلت */
@media screen and (max-width: 980px) {
    .wp-block-columns {
        flex-wrap: wrap !important;
    }
    .wp-block-column {
        flex: 1 1 45% !important;
    }
}

/* للموبايل */
@media screen and (max-width: 600px) {
    .wp-block-columns {
        flex-direction: column !important;
    }
    .wp-block-column {
        width: 100% !important;
        flex: 1 1 100% !important;
    }
    .flip-card {
        height: 300px;
    }
    .flip-card-front p {
        font-size: 18px !important;
    }
    .card-icon-container {
        width: 80px;
        height: 80px;
    }
}