/* Global styles for better readability and responsiveness */
body {
font-family: ‘Vazirmatn’, ‘Tahoma’, sans-serif; /* Fallback for Vazirmatn */
direction: rtl;
text-align: right;
line-height: 1.8;
color: #333;
margin: 0;
padding: 0;
background-color: #f8f8f8; /* Light background for the page */
}

/* General container for the article */
div[style*=”max-width: 900px”] {
box-sizing: border-box; /* Include padding and border in the element’s total width and height */
}

/* Headings styles */
h1 {
font-size: 32px;
font-weight: bold;
color: #0056b3;
text-align: center;
margin-bottom: 30px;
padding-bottom: 15px;
border-bottom: 2px solid #e0e0e0;
letter-spacing: -0.5px;
}

h2 {
font-size: 26px;
font-weight: bold;
color: #0056b3;
margin-top: 40px;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #e0e0e0;
}

h3 {
font-size: 20px;
font-weight: bold;
color: #007bff; /* A slightly lighter blue for sub-headings */
margin-top: 30px;
margin-bottom: 15px;
}

/* Paragraph styles */
p {
font-size: 17px;
margin-bottom: 25px;
color: #444;
}

/* List styles */
ul {
list-style-type: disc;
padding-right: 20px;
margin: 0;
font-size: 16px;
}

li {
margin-bottom: 8px;
}

/* Table styles */
table {
width: 100%;
border-collapse: collapse;
margin: 20px 0;
font-size: 16px;
text-align: right;
}

th, td {
padding: 12px 15px;
border: 1px solid #ddd;
text-align: right;
}

th {
background-color: #0056b3;
color: white;
text-align: center;
}

tbody tr:nth-child(even) {
background-color: #f2f2f2;
}

tfoot td {
background-color: #e6f7ff;
font-size: 15px;
color: #555;
text-align: center;
}

/* Responsive adjustments for table */
@media (max-width: 768px) {
table, thead, tbody, th, td, tr {
display: block;
}

thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}

tr {
border: 1px solid #ccc;
margin-bottom: 15px;
}

td {
border: none;
border-bottom: 1px solid #eee;
position: relative;
padding-right: 50%;
text-align: right; /* Changed to right for RTL */
}

td:before {
position: absolute;
top: 6px;
right: 6px; /* Changed to right for RTL */
width: 45%;
padding-left: 10px; /* Changed to left for RTL */
white-space: nowrap;
font-weight: bold;
content: attr(data-label);
}

/* Specific labels for table cells in responsive view */
td:nth-of-type(1):before { content: “نوع پروپوزال / مقطع تحصیلی:”; }
td:nth-of-type(2):before { content: “بازه تقریبی قیمت (تومان):”; }
}

/* Infographic replacement section */
div[style*=”display: flex;”] {
flex-direction: row; /* Default for larger screens */
}

@media (max-width: 600px) {
div[style*=”display: flex;”] {
flex-direction: column; /* Stack items vertically on small screens */
align-items: center; /* Center items when stacked */
}
div[style*=”flex: 1 1 280px;”] {
flex: 0 0 90%; /* Take almost full width on small screens */
max-width: 90%;
margin-bottom: 15px; /* Add space between stacked items */
}
}

/* FAQ section */
div[style*=”background-color: #ffffff; border: 1px solid #e0e0e0;”] h3 {
color: #333; /* Default color for FAQ question */
margin-bottom: 10px;
}
div[style*=”background-color: #ffffff; border: 1px solid #e0e0e0;”] h3 span {
color: #007bff; /* Blue for the text and plus sign */
}

/* Strong tags for emphasis */
strong {
font-weight: bold;
}

/* Specific colors for emphasis */
strong[style*=”color: #0056b3;”] { color: #0056b3; }
strong[style*=”color: #d9534f;”] { color: #d9534f; } /* Red for urgent/warning */
strong[style*=”color: #28a745;”] { color: #28a745; } /* Green for success/guarantee */

/* Links */
a {
color: #007bff;
text-decoration: none;
}

a:hover {
text-decoration: underline;
}

/* Responsive font sizes */
@media (max-width: 768px) {
h1 { font-size: 28px; }
h2 { font-size: 24px; }
h3 { font-size: 18px; }
p { font-size: 16px; }
ul, ol, li, table { font-size: 15px; }
div[style*=”font-size: 40px;”] { font-size: 35px; } /* Infographic icons */
h4 { font-size: 17px; } /* Infographic text */
div[style*=”background-color: #ffffff; border: 1px solid #e0e0e0;”] p {
font-size: 15px;
}
}

@media (max-width: 480px) {
h1 { font-size: 24px; }
h2 { font-size: 20px; }
h3 { font-size: 16px; }
p { font-size: 14px; }
ul, ol, li, table { font-size: 13px; }
div[style*=”font-size: 40px;”] { font-size: 30px; } /* Infographic icons */
h4 { font-size: 15px; } /* Infographic text */
div[style*=”background-color: #ffffff; border: 1px solid #e0e0e0;”] p {
font-size: 13px;
}
}

/* Specific styles for the table of contents div for better visibility */
div[style*=”border-left: 5px solid #4CAF50;”] {
background-color: #e8f5e9; /* Light green background */
border-left: 5px solid #4CAF50; /* Green border */
padding: 15px 20px;
margin-bottom: 30px;
border-radius: 8px;
}
div[style*=”border-left: 5px solid #4CAF50;”] h3 {
color: #2e7d32; /* Darker green for TOC heading */
margin-top: 0;
margin-bottom: 10px;
}
div[style*=”border-left: 5px solid #4CAF50;”] ul a {
color: #2e7d32; /* Green links for TOC */
text-decoration: none;
}
div[style*=”border-left: 5px solid #4CAF50;”] ul a:hover {
text-decoration: underline;
}

// This script is for interactive elements like FAQ toggles if needed.
// For a simple copy-paste to a block editor, it might not be supported directly,
// but included for completeness if the platform supports JS.
document.addEventListener(‘DOMContentLoaded’, function() {
const faqHeaders = document.querySelectorAll(‘div[style*=”background-color: #ffffff; border: 1px solid #e0e0e0;”] h3’);

faqHeaders.forEach(header => {
header.style.cursor = ‘pointer’; // Ensure cursor indicates interactivity
header.nextElementSibling.style.display = ‘none’; // Hide answers initially
const plusMinusSpan = header.querySelector(‘span:last-child’); // The + symbol

header.addEventListener(‘click’, function() {
const answer = this.nextElementSibling;
if (answer.style.display === ‘none’) {
answer.style.display = ‘block’;
if (plusMinusSpan) plusMinusSpan.textContent = ‘-‘;
} else {
answer.style.display = ‘none’;
if (plusMinusSpan) plusMinusSpan.textContent = ‘+’;
}
});
});
});