انجام پروپوزال رشته مدیریت منابع انسانی: راهنمای جامع و گام‌به‌گام

/* Responsive Styling for all devices */
@import url(‘https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/misc/vazirmatn-font-face.css’);

body {
margin: 0;
padding: 0;
background-color: #f0f2f5; /* Light grey background */
box-sizing: border-box;
}

/* Base font for content */
div, p, li, th, td {
font-family: ‘Vazirmatn’, sans-serif;
}

/* Heading Styles */
h1 {
font-family: ‘Vazirmatn’, sans-serif;
font-size: 2.8em; /* Base size for H1 */
font-weight: 800; /* Extra bold */
color: #1a2a3a; /* Darkest blue/grey */
text-align: center;
margin-bottom: 40px;
line-height: 1.3;
}

h2 {
font-family: ‘Vazirmatn’, sans-serif;
font-size: 2.2em; /* Base size for H2 */
font-weight: 700; /* Bold */
color: #1a2a3a;
margin-top: 50px;
margin-bottom: 25px;
}

h3 {
font-family: ‘Vazirmatn’, sans-serif;
font-size: 1.7em; /* Base size for H3 */
font-weight: 700;
color: #2e86de; /* Accent blue */
margin-top: 40px;
margin-bottom: 20px;
}

/* General text styles */
p {
font-size: 1.1em;
line-height: 1.8;
color: #333;
margin-bottom: 1em;
}

ul {
list-style-type: disc;
margin-right: 20px; /* For RTL support */
padding-left: 0;
}

ul li {
margin-bottom: 10px;
font-size: 1.1em;
line-height: 1.8;
color: #333;
}

/* Table styling */
table {
width: 100%;
border-collapse: collapse;
margin-bottom: 30px;
font-size: 1.05em;
border: 1px solid #ddd;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
border-radius: 8px;
overflow: hidden; /* Ensures border-radius applies to children */
}

table thead tr {
background-color: #2e86de; /* Header background color */
color: white;
}

table th, table td {
padding: 15px;
border: 1px solid #eee;
text-align: right; /* For RTL */
}

table th {
font-weight: 600;
min-width: 150px; /* Ensure headers don’t get too small */
}

table tbody tr:nth-child(even) {
background-color: #f9f9f9; /* Zebra striping */
}

table tbody tr:hover {
background-color: #f0f8ff; /* Hover effect */
}

/* Container for main content */
.container {
max-width: 900px;
margin: 0 auto;
padding: 20px;
background-color: #ffffff;
border-radius: 12px;
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
}

/* Table of contents styling */
.toc {
background-color: #f7f9fc;
padding: 25px;
border-radius: 10px;
margin-bottom: 40px;
border-left: 5px solid #2e86de;
}
.toc h2 {
color: #2e86de;
margin-top: 0;
margin-bottom: 20px;
}
.toc ul {
list-style: none;
padding: 0;
margin: 0;
}
.toc li {
margin-bottom: 10px;
}
.toc a {
text-decoration: none;
color: #333;
font-weight: 500;
transition: color 0.3s ease;
}
.toc a:hover {
color: #2e86de;
}
.toc ul ul { /* Sub-list for TOC */
padding-right: 20px; /* For RTL */
padding-left: 0;
margin-top: 5px;
list-style: none;
}
.toc ul ul li a {
color: #555;
font-weight: normal;
font-size: 0.95em;
}
.toc ul ul li a:hover {
color: #2e86de;
}

/* Styling for the list with colored borders (نکات کلیدی) */
ul[style*=”list-style-type: none;”] li {
list-style-type: none; /* Override any default list styling */
margin-bottom: 15px;
padding: 15px;
border-radius: 8px;
border-right: 4px solid; /* For RTL border */
border-left: none; /* Remove default LTR border */
line-height: 1.6;
font-size: 1.05em;
}

/* Specific colors for these list items – these styles are already inline, but this ensures fallback */
ul[style*=”list-style-type: none;”] li:nth-of-type(1) {
background-color: #e8f5e9;
border-color: #4caf50;
}
ul[style*=”list-style-type: none;”] li:nth-of-type(2) {
background-color: #e3f2fd;
border-color: #2196f3;
}
ul[style*=”list-style-type: none;”] li:nth-of-type(3) {
background-color: #fff3e0;
border-color: #ff9800;
}
ul[style*=”list-style-type: none;”] li:nth-of-type(4) {
background-color: #ffebee;
border-color: #f44336;
}

/* FAQ section styling */
div[style*=”background-color: #f7f9fc; padding: 20px;”] { /* Targeting FAQ divs */
border: 1px solid #e0e0e0;
}

/* Infographic-like blocks */
div[style*=”display: flex; flex-wrap: wrap;”] > div {
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
div[style*=”display: flex; flex-wrap: wrap;”] > div:hover {
transform: translateY(-5px);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}
div[style*=”display: flex; flex-wrap: wrap;”] span { /* Icons */
line-height: 1; /* Adjust line height for icons */
}

/* Conclusion box */
div[style*=”background-color: #e0f7fa;”] {
border: 1px solid #b2ebf2;
}

/* Responsive adjustments */
@media (max-width: 768px) {
h1 {
font-size: 2.2em;
margin-bottom: 30px;
}
h2 {
font-size: 1.8em;
margin-top: 40px;
margin-bottom: 20px;
}
h3 {
font-size: 1.5em;
margin-top: 30px;
margin-bottom: 15px;
}
p, ul li, table, .toc li {
font-size: 1em;
line-height: 1.7;
}
.container {
padding: 15px;
border-radius: 8px;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.07);
}
.toc, div[style*=”background-color: #f7f9fc; padding: 20px;”], div[style*=”background-color: #e0f7fa;”] {
padding: 15px;
}
table th, table td {
padding: 10px;
}
div[style*=”display: flex; flex-wrap: wrap;”] {
gap: 15px;
}
div[style*=”display: flex; flex-wrap: wrap;”] > div {
flex: 1 1 100%; /* Full width on smaller screens */
padding: 20px;
}
}

@media (max-width: 480px) {
h1 {
font-size: 1.8em;
margin-bottom: 20px;
}
h2 {
font-size: 1.5em;
margin-top: 30px;
margin-bottom: 15px;
}
h3 {
font-size: 1.3em;
margin-top: 25px;
margin-bottom: 10px;
}
p, ul li, table, .toc li {
font-size: 0.95em;
line-height: 1.6;
}
.container {
padding: 10px;
border-radius: 6px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}
.toc, div[style*=”background-color: #f7f9fc; padding: 20px;”], div[style*=”background-color: #e0f7fa;”] {
padding: 10px;
}
table th, table td {
padding: 8px;
}
.toc ul ul { /* Sub-list for TOC */
padding-right: 15px; /* For RTL */
}
div[style*=”display: flex; flex-wrap: wrap;”] > div span {
font-size: 2.5em; /* Smaller icons on small screens */
margin-bottom: 10px;
}
div[style*=”display: flex; flex-wrap: wrap;”] > div h3 {
font-size: 1.2em;
margin-bottom: 5px;
}
div[style*=”display: flex; flex-wrap: wrap;”] > div p {
font-size: 0.85em;
}
}

/* Global RTL adjustments */
body, div, p, li, th, td, h1, h2, h3, a {
direction: rtl;
text-align: right;
}
ul {
padding-right: 20px;
padding-left: 0;
list-style-position: inside; /* Ensures bullets/numbers stay inside padding */
}
.toc ul ul {
padding-right: 20px;
padding-left: 0;
}
table th, table td {
text-align: right;
}
ul[style*=”list-style-type: none;”] li {
border-left: none; /* Remove LTR border */
border-right: 4px solid; /* Add RTL border */
}