/* این بخش برای اطمینان از نمایش صحیح در محیطهای وب است.
در یک ویرایشگر بلوک واقعی، این استایلها میتوانند مستقیماً اعمال شوند
یا از طریق کلاسهای CSS تعریف شده در تم سایت شما فراخوانی گردند.
برای کپی در ورد، Word معمولاً استایلهای inline را تا حدی حفظ میکند. */
body {
direction: rtl; /* برای نمایش صحیح فارسی */
text-align: right;
font-family: ‘Vazirmatn’, ‘Tahoma’, sans-serif; /* فونت پیشنهادی */
margin: 0;
padding: 0;
background-color: #f9fbfd; /* رنگ پسزمینه کلی */
}
/* سبکهای عمومی برای محتوا */
.content-block p {
margin-bottom: 1em;
}
.content-block ul {
margin-bottom: 1em;
padding-right: 25px;
}
.content-block li {
margin-bottom: 0.5em;
}
/* رسپانسیو بودن برای دستگاههای مختلف */
@media (max-width: 768px) {
.content-block {
padding: 15px;
font-size: 1em;
}
.heading-h1 {
font-size: 2em !important;
padding: 15px 0 !important;
}
.heading-h2 {
font-size: 1.8em !important;
margin-top: 30px !important;
margin-bottom: 15px !important;
}
.heading-h3 {
font-size: 1.4em !important;
margin-top: 20px !important;
margin-bottom: 10px !important;
}
.infographic-simulation > div {
flex-direction: column;
gap: 15px;
}
.infographic-simulation > div > div {
flex: 1 1 100% !important;
}
.standard-table table, .standard-table thead, .standard-table tbody, .standard-table th, .standard-table td, .standard-table tr {
display: block;
}
.standard-table thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}
.standard-table tr {
border: 1px solid #e0e0e0;
margin-bottom: 15px;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 1px 5px rgba(0,0,0,0.05);
}
.standard-table td {
border: none;
position: relative;
padding-right: 50% !important;
text-align: right !important;
padding-left: 15px !important; /* Adjust padding for better look */
}
.standard-table td:before {
content: attr(data-label);
position: absolute;
left: 0;
width: 45%;
padding-right: 15px;
white-space: nowrap;
font-weight: bold;
color: #283593;
text-align: left;
}
.standard-table td:nth-of-type(1):before { content: “معیار انتخاب:”; }
.standard-table td:nth-of-type(2):before { content: “توضیحات:”; }
}
// این اسکریپت تنها برای شبیهسازی رسپانسیو بودن در صورت کپی به یک صفحه HTML است.
// در یک ویرایشگر بلوک واقعی، این نیازی نیست و توسط CSS یا ساختار بلوک مدیریت میشود.
document.addEventListener(‘DOMContentLoaded’, function() {
if (window.innerWidth th.textContent);
table.querySelectorAll(‘tbody tr’).forEach(row => {
Array.from(row.querySelectorAll(‘td’)).forEach((td, index) => {
td.setAttribute(‘data-label’, headers[index] + ‘:’);
});
});
}
}
});