انجام پروپوزال رشته تحقیقات آموزشی

/* CSS پیشنهادی برای بهبود نمایش در ویرایشگر بلوک یا سایت */
/* این کدها باید در قسمت سفارشی‌سازی CSS سایت یا در بلوک CSS سفارشی (Custom CSS) قرار گیرند تا استایل‌ها اعمال شوند. */

/* عمومی */
body {
font-family: ‘Iran Sans’, ‘Vazirmatn’, sans-serif; /* فونت‌های پیشنهادی برای فارسی */
line-height: 1.8;
color: #333;
background-color: #f8f8f8;
}

/* کانتینر اصلی مقاله */
.article-container {
max-width: 900px; /* برای دسکتاپ و تبلت */
margin: 0 auto;
padding: 20px;
box-sizing: border-box;
background-color: #fff;
box-shadow: 0 0 15px rgba(0,0,0,0.05);
border-radius: 10px;
}

/* ریسپانسیو بودن کانتینر برای موبایل */
@media (max-width: 768px) {
.article-container {
padding: 15px;
max-width: 100%; /* برای موبایل تمام عرض باشد */
}
}

/* هدینگ H1 */
h1 {
font-size: 2.8em; /* سایز بزرگ برای عنوان اصلی */
font-weight: 800; /* بسیار ضخیم */
color: #0056b3; /* رنگ آبی تیره */
text-align: center;
margin-bottom: 40px;
padding-bottom: 10px;
border-bottom: 3px solid #007bff; /* خط آبی روشن زیر عنوان */
}

/* هدینگ H2 */
h2 {
font-size: 2.2em; /* سایز بزرگتر */
font-weight: 700; /* ضخیم */
color: #0056b3; /* رنگ آبی تیره */
margin-top: 40px;
margin-bottom: 25px;
border-bottom: 2px solid #007bff; /* خط آبی روشن زیر عنوان */
padding-bottom: 10px;
}

/* هدینگ H3 */
h3 {
font-size: 1.8em; /* سایز متوسط */
font-weight: 600; /* نیمه‌ضخیم */
color: #006699; /* رنگ آبی متوسط */
margin-top: 30px;
margin-bottom: 15px;
}

/* پاراگراف‌ها */
p {
font-size: 1.1em;
text-align: justify;
margin-bottom: 20px;
line-height: 1.8;
}

/* لیست‌ها */
ul {
list-style-type: disc;
margin-left: 25px;
font-size: 1.1em;
margin-bottom: 20px;
}
ul li {
margin-bottom: 8px;
line-height: 1.6;
}

/* لیست‌های چک‌مارک */
ul.checklist {
list-style-type: ‘✅ ‘; /* استفاده از ایموجی به عنوان بولت */
padding-left: 20px;
}

/* استایل برای بلاک‌های اطلاعاتی/هایلایت */
.info-box {
background-color: #e0f7fa; /* آبی آسمانی روشن */
border-left: 5px solid #00bcd4; /* خط پررنگ آبی فیروزه‌ای */
padding: 20px;
margin-bottom: 30px;
border-radius: 8px;
}
.info-box h2 {
color: #00796b; /* سبز آبی تیره */
margin-top: 0;
border-bottom: none; /* حذف خط زیر h2 در اینفو باکس */
}

/* استایل برای جدول */
table {
width: 100%;
border-collapse: collapse;
margin-top: 25px;
margin-bottom: 30px;
min-width: 400px; /* حداقل عرض برای نمایش بهتر در موبایل */
background-color: #ffffff;
box-shadow: 0 2px 10px rgba(0,0,0,0.05);
border-radius: 8px;
overflow-x: auto; /* برای اسکرول افقی در موبایل */
}
caption {
caption-side: top;
font-weight: 700;
margin-bottom: 15px;
font-size: 1.3em;
color: #0056b3;
}
th, td {
padding: 12px 15px;
text-align: right; /* راست‌چین برای فارسی */
border: 1px solid #eee; /* خطوط کم‌رنگ */
}
thead tr {
background-color: #007bff; /* رنگ آبی روشن برای سربرگ */
color: white;
}
tbody tr:nth-child(even) { /* رنگ متناوب برای ردیف‌ها */
background-color: #f8f8f8;
}

/* استایل برای بخش FAQ */
.faq-section {
background-color: #f9f9f9;
border: 1px solid #eee;
border-radius: 8px;
padding: 20px;
margin-bottom: 30px;
}
.faq-section h3 {
font-size: 1.4em;
font-weight: 600;
color: #333;
margin-bottom: 10px;
}
.faq-section p {
font-size: 1.1em;
margin-bottom: 15px;
}

/* استایل برای جایگزین اینفوگرافیک (نمای کلی اجزا) */
.infographic-alternative {
background-color: #f0f8ff; /* آبی بسیار روشن */
border: 1px solid #cceeff; /* خط آبی روشن */
border-radius: 10px;
padding: 25px;
margin-bottom: 30px;
}
.infographic-alternative h3 {
color: #006699;
text-align: center;
margin-bottom: 20px;
font-size: 1.6em;
}
.infographic-alternative .item {
flex: 1 1 45%; /* برای دو ستون در دسکتاپ */
min-width: 280px; /* حداقل عرض برای هر آیتم */
background-color: #ffffff;
border: 1px solid #ddd;
border-radius: 8px;
padding: 15px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
.infographic-alternative .item p:first-child {
font-weight: 700;
color: #0056b3;
font-size: 1.2em;
margin-bottom: 10px;
}
.infographic-alternative .item p:last-child {
font-size: 0.95em;
line-height: 1.6;
}

/* ریسپانسیو بودن اینفوگرافیک برای موبایل */
@media (max-width: 600px) {
.infographic-alternative .item {
flex: 1 1 100%; /* یک ستون در موبایل */
}
}

/* لینک‌های فهرست مطالب */
.info-box ul li a {
text-decoration: none;
color: #007bff;
font-weight: 600;
transition: color 0.3s ease;
}
.info-box ul li a:hover {
color: #0056b3;
}

/* متن‌های هایلایت شده */
strong {
color: #c70039; /* رنگ قرمز تیره برای تاکید */
}

/* استایل برای ریسپانسیو بودن عمومی متن */
@media (max-width: 480px) {
h1 { font-size: 2em; }
h2 { font-size: 1.6em; }
h3 { font-size: 1.3em; }
p, ul, table, .info-box, .faq-section { font-size: 1em; }
}