/* --- START: Local Font Definition (All Weights) --- */
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 100;
  src: url('fonts/IBMPlexSansArabic-Thin.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 200;
  src: url('fonts/IBMPlexSansArabic-ExtraLight.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/IBMPlexSansArabic-Light.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/IBMPlexSansArabic-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/IBMPlexSansArabic-Medium.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/IBMPlexSansArabic-SemiBold.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/IBMPlexSansArabic-Bold.woff2') format('woff2');
}
/* --- END: Local Font Definition --- */


/*------[ variables css ]------*/
/*------[ mixins ]------*/
body {
	direction: rtl;
	font-family: 'IBM Plex Sans Arabic', sans-serif; /* تطبيق الخط الجديد على الموقع */
}

pre {
	border-left: 0;
	border-right: 11px solid #3498db;
	margin: 1.7em 0.3em 1.7em 0;
	padding: 0.1em 0.7em 0.3em 0.5em;
}

blockquote {
	border-left: 0;
	border-right: 11px solid #3498db;
}

.qa-main-heading {
	padding-right: 20px;
	padding-left: 0;
}

.qa-search-field {
	margin: 0 0 0 -40px;
	padding: 0 5px 0 40px;
}

.qa-search-button {
	position: relative;
}

.entry-content th, .entry-content td, .qa-c-item-content th, .qa-c-item-content td {
	text-align: right;
}
.entry-content ul, .qa-c-item-content ul {
	margin: 20px 20px 20px 0;
}
.entry-content ul > li:before, .qa-c-item-content ul > li:before {
	left: auto;
	right: -1.6em;
}
.entry-content ul > li > ul, .qa-c-item-content ul > li > ul {
	margin: 0 20px 0 0;
}
.entry-content ol, .qa-c-item-content ol {
	margin: 20px 20px 20px 0;
}
.entry-content ol > li > ol, .qa-c-item-content ol > li > ol {
	margin: 0 20px 0 0;
}

.qa-logo {
	margin: 0 0 0 1px;
}

@media (max-width: 979px) {
	.qam-search-mobile {
		border-left: 0;
		border-right: 1px solid #1dd2af;
	}
	.qam-search-mobile.orange {
		border-right-color: #f4a62a;
	}
	.qam-search-mobile.carrot {
		border-right-color: #e98b39;
	}
	.qam-search-mobile.alizarin {
		border-right-color: #ea6153;
	}
	.qam-search-mobile.turquoise {
		border-right-color: #1dd2af;
	}
	.qam-search-mobile.emerald {
		border-right-color: #40d47e;
	}
	.qam-search-mobile.peter-river {
		border-right-color: #4aa3df;
	}
	.qam-search-mobile.amethyst {
		border-right-color: #a66bbe;
	}
	.qam-search-mobile.wet-asphalt {
		border-right-color: #3d566e;
	}

	.qam-menu-toggle {
		float: right;
		margin: 0 0 0 10px;
	}

	.qa-nav-main {
		left: auto;
		right: 0;
	}

	.qa-nav-main-link:before {
		margin: 0 0 0 15px;
	}

	.qa-nav-sub-item {
		float: right;
	}
}

@media (min-width: 980px) {
	.qa-nav-main-item {
		float: right;
	}
	.qa-nav-main-item-opp {
		float: left;
	}
	.qa-nav-main-item-opp:last-child {
		margin: 0 50px 0 0;
	}
}

.qam-account-items-wrapper {
	float: left;
}

.qam-account-items {
	right: auto;
	left: 0;
}

.qa-logged-in:before {
	margin: 0 0 0 10px;
}

.qam-logged-in-points:before {
	margin: 0 0 0 10px;
}

.qa-nav-user-updates:before {
	margin: 0 0 0 10px;
}

.qa-nav-user-logout:before {
	margin: 0 0 0 10px;
}

.qa-q-list-item.qa-q-favorited {
	border-right: 1px solid #8e44ad;
}

.qa-favoriting .qa-waiting {
	margin-left: 0;
	margin-right: -37px;
}

.qa-q-item-stats {
	float: right;
}

@media (min-width: 800px) {
	.qa-voting {
		float: right;
	}
}

@media (min-width: 800px) {
	.qa-a-count, .qa-view-count {
		float: right;
	}
}

.qa-q-item-main {
	float: right;
	padding-right: 10px;
}
@media (max-width: 240px) {
	.qa-q-item-main {
		padding-right: 0;
	}
}

.qam-q-list-close-icon {
	float: right;
	margin: 5px 0 0 5px;
}

.qa-q-item-avatar {
	margin: 0 0 0 5px;
}
@media (min-width: 480px) {
	.qa-q-item-avatar {
		float: right;
	}
}

.qa-q-item-meta {
	float: right;
}
.qa-q-item-meta .qa-category-link.qa-cat-favorited {
	padding-right: 14px;
}
.qa-q-item-meta .qa-category-link.qa-cat-favorited:before {
	left: auto;
	right: 0;
}
.qa-q-item-meta .qa-user-link.qa-user-favorited {
	padding-right: 14px;
}
.qa-q-item-meta .qa-user-link.qa-user-favorited:before {
	left: auto;
	right: 0;
}

.qa-top-users-avatar .qa-avatar-link {
	float: right;
	margin-left: 1em;
}
.qa-top-users-label .qa-user-link {
	float: right;
}

.qa-ranking-users-points .qa-top-users-score {
	float: left;
	padding-left: 6px;
	padding-right: 1.8em;
}

.qa-top-users-score:before {
	left: initial;
	right: 0;
}

@media (min-width: 980px) {
	.qa-top-users-label .qa-user-link:after {
		right: initial;
		left: 0;
		border-right: 7px solid #e74c3c;
		border-left: initial;
	}

	.qa-top-users-label .qa-user-link:hover:after, .qa-top-users-label .qa-user-link:focus:after {
		-ms-transform: translate(-80px, 0);
		-webkit-transform: translate(-80px, 0);
		transform: translate(-80px, 0);
	}
}
.qa-top-users-label .qa-user-link.qa-user-favorited {
	padding-left: 10px;
	padding-right: 5px;
}

.qam-user-score-icon {
	padding: 2px 1.8em 2px 6px;
	float: left;
}
.qam-user-score-icon:before {
	left: auto;
	right: 0;
}

.qa-browse-cat-link:before {
	right: auto;
	left: -5px;
	border-right: 5px solid #c0392b;
}

.qa-browse-cat-note a {
	right: auto;
	left: 5px;
	padding: 2px 2em 2px 10px;
}
.qa-browse-cat-note a:before {
	left: auto;
	right: 0;
}

@media (min-width: 980px) {
	.qa-template-user [class^="qa-part-form"], .qa-template-user .qa-part-message-list {
		float: left;
		clear: left;
	}

	.qa-template-user .qa-part-form-profile {
		float: right;
	}
}

.qa-form-light-button {
	float: left;
	margin: 0 5px 0 0;
}

.qa-form-light-button-answer {
	float: right;
	margin: 0 0 0 5px;
}

.qa-form-light-button-comment {
	float: right;
	margin: 0;
}

.qa-q-view-stats {
	float: right;
}

.qam-q-view-close-icon {
	float: right;
	margin: 8px 0 5px 0;
}

.qa-q-view-avatar {
	float: left;
}

@media (max-width: 979px) {
	.qa-q-view-meta {
		clear: right;
	}
}

@media (min-width: 980px) {
	.qa-q-view-main {
		float: right;
		margin: 0 20px 0 0;
	}
}

.qa-q-view-closed {
	padding: 10px 54px 10px 10px;
}
.qa-q-view-closed:before {
	left: auto;
	right: 0;
}
.qa-q-view-closed:hover {
	padding: 10px 54px 10px 10px;
	margin-bottom: 5px;
	background: #e74c3c;
	color: #fff;
}
.qa-q-view-closed:hover a {
	color: #fff;
	border-bottom: 1px dotted #fff;
}
.qa-q-view-closed:hover a:hover {
	color: #fff;
	border-bottom: 0;
}

.qa-a-item-avatar {
	float: left;
}

.qa-a-selection {
	position: absolute;
}
@media (max-width: 979px) {
	.qa-a-selection {
		left: auto;
		right: 100px;
	}
	.qa-a-item-meta {
		clear: right;
	}
}
@media (min-width: 980px) {
	.qa-a-selection {
		left: auto;
		right: 20px;
	}

	.qa-a-item-main {
		float: left;
		margin: 0 20px 0 0;
	}
}
.qa-a-selection .qa-waiting {
	margin: -7px -7px 0 0;
}

.qa-c-list-item .qa-form-light-button {
	float: left;
	margin: 0 5px 0 0;
}
.qa-c-list-item .qa-form-light-button-comment {
	float: right;
}

.qa-c-list-item .qa-vote-buttons {
	margin-right: initial;
	margin-left: 4px;
}
.qa-c-list-item .qa-vote-count {
	float: right;
	margin-left: 8px;
}

.qa-c-item-avatar {
	right: auto;
	left: 10px;
}

@media (max-width: 767px) {
	.qa-c-item-meta {
		padding-left: 24px;
		padding-right: initial;
	}
}

.qa-activity-count-item {
	float: right;
}

.qa-nav-cat-link.qa-nav-cat-favorited {
	padding-right: 20px;
}
.qa-nav-cat-link.qa-nav-cat-favorited:before {
	left: auto;
	right: 0;
}

.qa-nav-cat-note {
	float: left;
}

.qa-feed-link:before {
	float: right;
	margin-right: 0;
	margin-left: 8px;
}

@media (min-width: 480px) {
	.qa-nav-footer {
		float: right;
	}
	.qa-attribution {
		float: left;
		border-left: 1px solid rgba(255, 255, 255, 0.5);
	}
	.qam-attribution {
		float: left;
		padding: 0 5px 0 0;
	}
}

.qa-nav-footer-item {
	float: right;
}

.qa-nav-footer-link {
	padding: 0 0 0 5px;
	border-width: 0 0 0 1px;
}

@media (min-width: 980px) {
	.qa-main {
		float: right;
	}
	.qa-sidepanel {
		float: left;
	}
	.qam-footer-col {
		float: right;
	}
}

.qa-vote-buttons {
	float: right;
}

.qa-netvote-count-data {
	direction: ltr;
}

.qa-vote-up-button, .qa-vote-down-button, .qa-voted-up-button,
.qa-voted-down-button, .qa-vote-up-disabled, .qa-vote-down-disabled {
	left: initial;
	right: 4px;
}

.qa-c-list-item .qa-vote-up-button,
.qa-c-list-item .qa-vote-down-button,
.qa-c-list-item .qa-voted-up-button,
.qa-c-list-item .qa-voted-down-button,
.qa-c-list-item .qa-vote-up-disabled,
.qa-c-list-item .qa-vote-down-disabled {
	left: initial;
	right: 0;
}

/* --- Final Custom Modifications --- */

/* 1. تغيير خلفية الهيدر بالكامل إلى الأبيض */
.qam-main-nav-wrapper {
    background: #ffffff !important;
    border-bottom: 1px solid #e0e0e0 !important;
}

/* 2. تغيير لون عنوان الموقع إلى الأسود */
.qa-logo a {
    color: #000000 !important;
}

/* 3. تغيير لون أيقونة القائمة إلى الأخضر */
.qam-menu-toggle i {
    color: #28a745 !important;
}

/* 4. تعديل زر تسجيل الدخول */
#qam-account-toggle {
    background-color: #ffffff !important; /* خلفية بيضاء للزر */
}
#qam-account-toggle:hover {
    background-color: #f0f0f0 !important; /* خلفية رمادية فاتحة عند التمرير */
}

/* 5. تغيير لون نص وأيقونة زر تسجيل الدخول */
.qam-account-handle,
#qam-account-toggle .qam-auth-key {
    color: #000000 !important; /* لون أسود للنص والمفتاح */
}

/* 6. تغيير لون أيقونة المفتاح إلى الأخضر عند تمرير الماوس */
#qam-account-toggle:hover .qam-auth-key {
    color: #28a745 !important;
}

/* 7. جعل حاوية الاقتباس بيضاء */
.qa-q-view-content blockquote {
    background-color: #ffffff !important;
}

/* --- START: Footer Customization (Simplified & Improved) --- */

/* 8. تغيير خلفية الفوتر بالكامل إلى الأبيض */
.qam-footer-box,
.qa-footer {
    background-color: #ffffff !important;
}

/* 9. تغيير لون روابط الفوتر والخطوط الفاصلة */
.qam-footer-box a,
.qa-footer a,
.qa-attribution {
    color: #28a745 !important; /* لون أخضر مميز للروابط */
    border-color: #dddddd !important; /* لون رمادي فاتح للخطوط الفاصلة */
    text-decoration: none !important; /* إزالة أي خطوط سفلية */
}

/* 10. إضافة تأثير عند تمرير الماوس على روابط الفوتر */
.qam-footer-box a:hover,
.qa-footer a:hover {
    color: #228B22 !important; /* جعل اللون أغمق قليلاً عند التمرير */
    text-decoration: underline !important; /* إضافة خط سفلي عند التمرير */
}

/* --- END: Footer Customization --- */

/* --- START: Social Share Buttons (Final Design by Manus) --- */
.qa-social-share-container {
    text-align: center; /* لتوسيط كل شيء بالداخل */
    margin-top: 20px;
    margin-bottom: 15px;
    padding-top: 15px;
    border-top: 1px solid #eee;
}

.qa-social-share-container span {
    display: block; /* يجعل النص يأخذ سطراً كاملاً */
    font-size: 18px;
    color: #34495e;
    margin-bottom: 15px; /* مسافة بين النص والأيقونات */
}

.qa-social-icons-wrapper a {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 5px;
    color: #fff !important;
    text-align: center;
    margin: 0 5px;
    font-size: 20px;
    text-decoration: none !important;
    border-bottom: none !important;
    transition: transform 0.2s;
}

.qa-social-icons-wrapper a:hover {
    transform: translateY(-3px); /* تأثير حركة بسيط عند التمرير */
}

.qa-social-share-facebook { background-color: #3b5998; }
.qa-social-share-twitter { background-color: #1da1f2; }
.qa-social-share-whatsapp { background-color: #25d366; }
.qa-social-share-telegram { background-color: #0088cc; }
.qa-social-share-reddit { background-color: #ff4500; }
/* --- END: Social Share Buttons --- */