﻿@charset "UTF-8";
.fa-400{font-weight: 400;}
/*----------------- اضافة قائمة منسدلة مع زر ثلاث نقاط مع كل عناصرها ومحتواها  */
.mod-yendifvideoshare-videos .jk-item-video{
	position: relative
}
.menu-3dot-hr{margin: 0 16px;opacity: 0.15}
.mod-yendifvideoshare-videos .jk-item-video .menu-3dot-container{
   background-color: #fff;
    z-index: 9999;
    position: fixed;
    min-width: 230px;
    max-width: 350px;
    height: auto;
    border-radius: 12px;
    -webkit-box-shadow: 0px 0px 12px -6px #000000;
    box-shadow: 0px 0px 12px -6px #000000;
}
.mod-yendifvideoshare-videos .jk-item-video .menu-3dot-container ul.menu-3dot-contents{
	list-style: none;
	padding: 0 ;
	}
.mod-yendifvideoshare-videos .jk-item-video .menu-3dot-container ul.menu-3dot-contents .menu-3dot-item{
	padding: 8px 15px;
	cursor: pointer;
	font-size: 14px;
	position: relative;
	}
.mod-yendifvideoshare-videos .jk-item-video .menu-3dot-container ul.menu-3dot-contents .menu-3dot-header{
    padding: 8px 14px;
	cursor: pointer;
/*	border-bottom: 1px solid #E5E5E5;*/
	padding-bottom: 6px;
/*	color: #0345bf;*/
	color: #4182FC;
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
	position: relative;
	font-size: 13px;
	}
.mod-yendifvideoshare-videos .jk-item-video .menu-3dot-container ul.menu-3dot-contents .menu-3dot-item:hover{
	background-color: #EEEEEE;
	}
.mod-yendifvideoshare-videos .jk-item-video .menu-3dot-container ul.menu-3dot-contents .menu-3dot-item i{
    margin-left: 12px;
	font-size: 20px;
	vertical-align: middle;
}
.mod-yendifvideoshare-videos .jk-item-video .menu-3dot-container ul.menu-3dot-contents .menu-3dot-item a{
    color: #252525
}
.jk-item-video.yendif-video-share-grid-item .card-body-right .sof-3dots-button{
    padding: 20px;
	border-radius: 50%;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 30px;
    cursor: pointer;
	border: 1px solid #FFFFFF;
}
.jk-item-video.yendif-video-share-grid-item .card-body-right .sof-3dots-button:hover{
	background-color: #EEEEEE;
	border: 1px solid #EEEEEE;
}

.menu-3dot-item-active, .menu-3dot-item-active:hover{
background-color: #EEEEEE;
	padding: 20px;
	border-radius: 50%;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 30px;
    cursor: pointer;
	border: 1px solid #FFFFFF;
}
.must-login{
	position: absolute;
    left: 20px;
	bottom: 4px;
	color: #0345bf;
    border: 1px solid #B9CDF2 !important;
    border-radius: 10px;
    padding: 2px 15px !important;
   line-height: 17px;
    height: 28px;
}
.sof-user-400{font-weight: 900 !important;margin-left: 10px;font-size: 15px;transform: scaleX(-1);}
/*-----------------تعديل فتح الفيديو في بوب اب من القائمة المنسدلة */
.sof-popup-main .sof-popup-header{
    z-index: 5;
    top: -40px;
    position: absolute;
    width: 100%;
    height: 40px;
/*    border: 1px solid #F9E90E;*/
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.mfp-iframe-holder .mfp-close{ 
    position: relative !important ;
    top: 0 !important;
	left: 0 !important;
	width: 44px !important;
	text-align: center;
	padding-right: 0 !important;
/*    display: inline-block !important;	*/
}
.mfp-iframe-holder .mfp-close:hover{ 
   background-color: #F1F1F1;color: #323232;border-radius: 50%;
}
.sof-popup-main .sof-popup-explain{
   color: #BBBBBB;font-size: 13px;
}
.sof-popup-show-description{
    padding: 0 12px;
    height: 80%;
    width: auto;
    color: #D4D4D4;
    cursor: pointer;
    display: flex;
    align-items: center;
}
.sof-popup-show-description:hover{ background-color: #F1F1F1;color: #323232;border-radius: 8px;}
.sof-popup-description-main{
    z-index: 10;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
}
.sof-popup-description-inner{background-color: #FDFDFD;max-width: 600px;border-radius: 8px; padding:0 20px; margin: 20px auto;}
.sof-popup-description{
   line-height: 1.5;    
    color: #474747;     
    text-align: right;
   	overflow: hidden;
    overflow-y: scroll;
	font-size: 22px;
}
.sof-popup-description .yendif-video-share-description{margin-top: 10px !important;font-size: 16px;}

.popup-desc-active{background-color: #F1F1F1;color: #323232;border-radius: 8px;font-weight: bold;}
.sof-popup-description-header{min-height: 35px;padding: 10px;border-bottom: 1px solid #E7E7E7;margin-bottom: 10px;display: flex;justify-content: space-between;align-items: center;}
.sof-popup-description-lable{font-weight: bold;font-size: 18px;}
.sof-popup-description-close{font-size: 25px;width: 40px;height: 40px;border-radius: 50%;cursor: pointer;padding: 6px;display: flex;flex-wrap: wrap;
    justify-content: center;align-content: center;}
.sof-popup-description-close:hover{background-color: #EDEDED;font-weight: bold;font-size: 20px;}
.sof-popup-description-closeplay {display: flex;align-items: center;cursor: pointer;}	
.sof-popup-description-closeplay i{margin: 06px;font-size: 23px;color: #309d28;}	


.sof-popup-info { position: absolute;
    display: flex;
	align-items: center;
    color: #fff;
    padding: 20px 0; }
.sof-popup-title {
color: #D6D6D6;font-size: 16px;position: relative;text-align: right;margin-left: 30px;
/*    إظهار العنوان كامل بكل أسطره*/
/*
	word-wrap: break-word;
	overflow-wrap: break-word;
	white-space: normal;
	line-height: 1.4; 
*/
	/*    تحديد العنوان لسطرين فقط*/
		word-wrap: break-word;
		overflow-wrap: break-word;
		white-space: normal;
		line-height: 1.4;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		text-overflow: ellipsis;
	 }
.sof-popup-category {opacity: 0.7;margin: 0;}
.sof-popup-category a {
color: #F3F3F3;font-size: 13px;padding:0 6px ;/*border: 1px solid #787878;*/border-radius: 8px;cursor: pointer;min-width: 80px;display: block;text-align: right;
word-wrap: break-word;
	overflow-wrap: break-word;
	white-space: normal;
	line-height: 1.4;}
.mfp-fade.mfp-bg.mfp-ready {
	opacity: 1 !important;
	pointer-events: none !important;
	-webkit-user-select: none; /* Safari */
  -ms-user-select: none;      /* IE 10 and IE 11 */
  user-select: none;         /* Standard syntax */}
.mfp-iframe-scaler iframe{border-radius: 12px ;}
.mfp-iframe-holder .mfp-content{width: 65%;max-width: none !important;}
.sof-popup-category-image .category_image-show .yendif-video-share-image {
    background-position: center;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    background-size: cover;
	margin: 0 !important;
}
.sof-popup-category-wrap{display: flex;align-items: center;}
/*-----------------تعديل فتح احفظ الفيديو في قائمة والمحفوظات من القائمة المنسدلة */
/*-----------------تعديل فتح احفظ الفيديو في قائمة */

.sof-mylist-select-wrap {
flex: 1;
max-height: 150px;
overflow-y: auto;
overscroll-behavior: contain;
}
.sof-list-item {
height: 35px;
display: flex;
justify-content: space-between;
padding: 6px 10px;
cursor: pointer;
font-size: 14px;
}
.sof-list-item:hover {
background: #E5E5E5;
}
.sof-list-item.sof-list-active {
background: #4a7cf7;
color: #fff;
}
.sof-mylist-videos {
min-height: 300px;
}
.sof-delete-list { color: #c00; cursor: pointer; font-size: 15px; white-space: nowrap;margin: 0 15px;padding:2px 8px;border-radius: 6px;font-weight: bold;}
.sof-list-active .sof-delete-list {background-color: #FFFFFF; }
.sof-mylists-explain{font-size: 13px;margin-top: 10px;margin-bottom: 6px; padding: 0 18px;color: #717171;}
.sof-lists-container{
	max-height: 200px;
/*	overflow-y: scroll;*/
	box-sizing: border-box;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
}
.sof-list-new{
    display: flex;
    padding: 6px 8px 4px;
    border-top: 1px solid #eee;
    margin-top: 4px;
    gap: 4px;
    flex-direction: column;
}
.sof-list-new-wrap{display: flex;flex-direction: column ;align-items: center;justify-content: space-between;}
.sof-list-new-title, .sof-list-dropdown-title{font-size: 13px;font-weight: bold;}
.sof-list-new-title{margin-top: 15px;}
.sof-list-dropdown-close, .sof-mylist-close{width: 40px;height: 40px;border-radius: 50%;cursor: pointer;padding: 6px;display: flex;flex-wrap: wrap;
    justify-content: center;align-content: center;}
.sof-list-dropdown-close:hover, .sof-mylist-close:hover{background-color: #EDEDED;font-weight: bold;font-size: 18px;}
.sof-list-new > .sof-list-new-wrap > .sof-new-list-input{padding: 3px 5px !important;margin-bottom: 10px; }
.sof-new-list-add {width: 100%; background: #4a7cf7; color: #fff; border-radius: 3px; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 14px; line-height: 1;padding: 8px 0; }
.sof-new-list-add:hover { background: #3a6ce7; }
.sof-no-lists-saved{font-weight: normal;color: #DA575A;border:1px solid #F3D0D0;padding: 5px 10px;border-radius: 5px;}
.sof-already-saved { font-weight: bold;display: flex;}
.sof-already-saved .fa-circle-xmark{ font-size: 18px;float: left;color: #DB696C;margin: 0 !important;font-weight: 400;line-height: 1.5;}
.soflists-is-saved{width: 100%;}
.soflists-is-saved-in{font-weight: normal;}
.sof-list-dropdown { position: fixed; background: #fff; border: 1px solid #ddd; border-radius: 4px; box-shadow: 0 2px 8px rgba(0,0,0,0.15); z-index: 10000; padding: 6px 0; }
.sof-list-dropdown-header { display: flex; justify-content: space-between; align-items: center; padding: 4px 8px 6px 12px; border-bottom: 1px solid #eee; margin-bottom: 4px; }
.sof-list-option { padding: 6px 12px; cursor: pointer; font-size: 13px; }
.sof-list-option:hover { background: #f0f0f0; }

.sof-mylist-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.7); z-index: 9999; display: flex; align-items: center; justify-content: center; }
.sof-mylist-panel { background: #fff; border-radius: 8px; width: 70%; max-width: 70%;height: 85%; max-height: 85%; display: flex; flex-direction: column; overflow: hidden; }
.sof-mylist-header { display: flex; justify-content: space-between; align-items: center; padding: 6px 18px; border-bottom: 1px solid #eee;margin-bottom: 10px; }
.sof-mylist-title { font-size: 18px; font-weight: bold; }
.sof-mylist-close { font-size: 28px; cursor: pointer; line-height: 1; color: #666; }
.sof-mylist-close:hover { color: #000; }
.sof-mylist-selector { padding: 10px;display: flex; gap: 8px; align-items: center;max-width: 500px;margin: 0 20px 15px 0;border-radius: 12px;border: 1px solid #CECECE;}
.sof-mylist-select { flex: 1; padding: 6px 8px; border: 1px solid #ccc; border-radius: 4px; font-size: 14px; }

.sof-mylist-videos { flex: 1; overflow-y: auto; padding:0 18px 12px; }
.sof-mylist-empty { text-align: right; padding: 40px 0; color: #6B6B6B; font-size: 15px;display: flex;align-items: center;}
.sof-mylist-empty i{ margin-left: 10px;font-size: 32px; color: #d3d3d3;}
.sof-mylist-loading{ text-align: center; padding: 40px 0; color: #424242; font-size: 25px; }
.sof-mylist-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.sof-mylist-item {overflow: hidden; cursor: pointer; }
.sof-mylist-thumb { position: relative; padding-bottom: 56.25%; border-radius: 10px; }
.sof-mylist-thumb img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;border-radius: 10px; }
.sof-mylist-duration { position: absolute; bottom: 4px; right: 4px; background: rgba(0,0,0,0.8); color: #fff; padding: 1px 5px; font-size: 12px; border-radius: 2px; }
.sof-mylist-info { display: flex; justify-content: space-between; align-items: flex-start; padding: 8px 0; }
.sof-mylist-vtitle { font-size: 13px; line-height: 1.3; flex: 1; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.sof-mylist-remove {cursor: pointer; font-size: 16px;flex-shrink: 0;padding: 8px;border-radius: 50%;width: 30px;height: 30px;display: flex;align-items: center;justify-content: center;margin-top: -7px;}
.sof-mylist-remove:hover { background-color: #EDEDED; }

.sof-mylist-videos-search{padding: 0 20px;}
label.sof-mylist-search{color: #717171;margin: 5px 0;font-size: 13px;}
#sof-mylist-search-input{max-width: 500px;margin-bottom: 15px;border-radius:10px}
.sof-list-item-inner{display: flex;}
p.sof-list-v-count{margin: 0 6px;color: #818181;}
.sof-list-active p.sof-list-v-count{color: #E6EEF9;}






















