/*!
 * استایل افزونه اختصاصی مدرسه رشد
 * راست‌چین، مینیمال، و سازگار با موبایل — رنگ‌ها با متغیرهای CSS قابل تغییرند.
 */

:root {
	--roshd-purple: #5c2d91;
	--roshd-purple-dark: #3d1f61;
	--roshd-teal: #1e8a6e;
	--roshd-bg-soft: #f6f3fb;
	--roshd-border: #e3d9f2;
	--roshd-text: #2c2c2c;
	--roshd-error: #b00020;
	--roshd-error-bg: #fdebec;
	--roshd-success-bg: #eaf7f1;
	--roshd-radius: 10px;
}

.roshd-form,
.roshd-box,
.roshd-parent-panel,
.roshd-teacher-panel,
.roshd-staff-grid,
.roshd-events-list,
.roshd-stat-box,
.roshd-admin-wrap {
	direction: rtl;
	text-align: right;
	font-family: Tahoma, "Vazirmatn", "IRANSans", sans-serif;
	color: var(--roshd-text);
	box-sizing: border-box;
}
.roshd-form *,
.roshd-box *,
.roshd-staff-grid *,
.roshd-events-list * {
	box-sizing: border-box;
}

/* -------------------- جعبه‌های پیام -------------------- */
.roshd-box {
	background: #fff;
	border: 1px solid var(--roshd-border);
	border-radius: var(--roshd-radius);
	padding: 20px;
	margin: 16px 0;
}
.roshd-box-success {
	background: var(--roshd-success-bg);
	border-color: var(--roshd-teal);
}
.roshd-box-error {
	background: var(--roshd-error-bg);
	border-color: var(--roshd-error);
	color: var(--roshd-error);
}
.roshd-credentials {
	background: #fff;
	border: 1px dashed var(--roshd-purple);
	border-radius: var(--roshd-radius);
	padding: 14px 16px;
	margin-top: 12px;
}
.roshd-admin-notice {
	background: #fff8e6;
	border: 2px dashed #d98c00;
	color: #7a5200;
	font-size: 13px;
}
.roshd-admin-notice a {
	color: #7a5200;
	text-decoration: underline;
}
.roshd-admin-notice p {
	margin: 0;
}

/* -------------------- فرم‌ها -------------------- */
.roshd-form {
	max-width: 640px;
	background: var(--roshd-bg-soft);
	border: 1px solid var(--roshd-border);
	border-radius: var(--roshd-radius);
	padding: 24px;
}
.roshd-form-subtitle {
	margin: 18px 0 10px;
	color: var(--roshd-purple-dark);
	border-bottom: 2px solid var(--roshd-border);
	padding-bottom: 6px;
}
.roshd-field {
	margin: 0 0 16px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.roshd-field label {
	font-weight: 700;
	font-size: 14px;
}
.roshd-required {
	color: var(--roshd-error);
}
.roshd-field input[type="text"],
.roshd-field input[type="tel"],
.roshd-field input[type="email"],
.roshd-field input[type="url"],
.roshd-field input[type="password"],
.roshd-field select,
.roshd-field textarea {
	/* !important روی این‌ها عمداً است: خیلی از قالب‌های وردپرس مستقیماً روی input/select/textarea
	   (بدون کلاس) استایل تعریف می‌کنند تا فرم‌های خودشان یکدست به‌نظر برسند؛ چون آن استایل قالب
	   می‌تواند از نظر specificity با کلاس‌های افزونه برابر یا حتی بالاتر باشد، بدون !important
	   ظاهر فیلدهای این افزونه (رنگ کادر، گردی گوشه، پس‌زمینه) کاملاً به قالب فعال سایت بستگی پیدا
	   می‌کرد و می‌توانست هر شکلی بگیرد — دقیقاً همان مشکلی که باعث زشت‌شدن دکمه‌ها هم شده بود. */
	width: 100% !important;
	padding: 10px 12px !important;
	border: 1px solid var(--roshd-border) !important;
	border-radius: 8px !important;
	font-size: 15px !important;
	font-family: inherit !important;
	background: #fff !important;
	color: var(--roshd-text) !important;
	box-sizing: border-box !important;
}
.roshd-field input:focus,
.roshd-field select:focus,
.roshd-field textarea:focus {
	outline: none !important;
	border-color: var(--roshd-purple) !important;
	box-shadow: 0 0 0 3px rgba(92, 45, 145, 0.12) !important;
}
.roshd-field small {
	color: #6b6b6b;
	font-size: 12px;
}
.roshd-grade-checkboxes {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	padding: 10px 12px;
	border: 1px solid var(--roshd-border) !important;
	border-radius: 8px !important;
	background: #fff !important;
}
.roshd-grade-checkbox {
	display: flex;
	align-items: center;
	gap: 6px;
	font-weight: 400 !important;
	font-size: 14px !important;
	cursor: pointer;
}
.roshd-grade-checkbox input[type="checkbox"] {
	width: auto !important;
	margin: 0 !important;
	cursor: pointer;
}
.roshd-error {
	color: var(--roshd-error);
	font-size: 13px;
}
.roshd-error-general {
	display: block;
	margin-bottom: 12px;
}
.roshd-honeypot {
	position: absolute !important;
	left: -9999px !important;
	top: -9999px !important;
	height: 0;
	overflow: hidden;
}

/* !important در این بخش (و در بقیهٔ استایل دکمه‌ها/فیلدهای این فایل) عمداً است: بسیاری از
   قالب‌های وردپرس مستقیماً روی button/input[type=submit] (با specificity برابر یا بالاتر از یک
   کلاس ساده، و گاهی خودشان !important) استایل تعریف می‌کنند تا همهٔ دکمه‌های سایت یکدست به‌نظر
   برسند؛ بدون !important همین‌جا، آن استایل قالب می‌تواند رنگ/گردی‌گوشه/پدینگ دکمه‌های افزونه را
   کاملاً override کند و به دکمهٔ خاکستریِ پیش‌فرض قالب تبدیلشان کند. */
.roshd-btn,
.roshd-btn-submit {
	display: inline-block;
	background: var(--roshd-purple) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 8px !important;
	padding: 12px 26px !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	font-family: inherit !important;
	line-height: normal !important;
	cursor: pointer;
	text-decoration: none;
	transition: background 0.15s ease;
}
.roshd-btn:hover,
.roshd-btn-submit:hover {
	background: var(--roshd-purple-dark) !important;
}
.roshd-submit-field {
	margin-top: 6px;
}

/* فرم ورود وردپرس (wp_login_form) داخل جعبه‌های ما */
.roshd-panel-login form p {
	margin: 0 0 12px;
}
.roshd-panel-login input[type="text"],
.roshd-panel-login input[type="password"] {
	width: 100% !important;
	padding: 10px 12px !important;
	border: 1px solid var(--roshd-border) !important;
	border-radius: 8px !important;
	background: #fff !important;
	color: var(--roshd-text) !important;
	box-sizing: border-box !important;
}
.roshd-panel-login input[type="submit"] {
	background: var(--roshd-purple) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 8px !important;
	padding: 10px 22px !important;
	cursor: pointer;
	font-weight: 700 !important;
}

/* لینک «رمز عبور را فراموش کرده‌اید؟» زیر فرم ورود، و لینک «بازگشت به فرم ورود» / «تلاش دوباره»
   در نمای بازیابی رمز عبور — هر دو با همین یک کلاس، چون از نظر بصری یک عنصر ثانویهٔ کوچک‌اند. */
.roshd-forgot-password {
	margin: 10px 0 0;
	font-size: 13px;
	text-align: center;
}
.roshd-forgot-password a {
	color: var(--roshd-purple);
	text-decoration: none;
}
.roshd-forgot-password a:hover {
	text-decoration: underline;
}

/* -------------------- پنل والدین / معلمان -------------------- */
.roshd-panel-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 16px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--roshd-border);
	font-weight: 700;
}
.roshd-logout {
	color: var(--roshd-purple);
	text-decoration: none;
	font-weight: 400;
	font-size: 13px;
}
.roshd-panel-actions {
	display: flex;
	align-items: center;
	gap: 16px;
}
.roshd-student-card {
	background: #fff;
	border: 1px solid var(--roshd-border);
	border-radius: var(--roshd-radius);
	padding: 16px;
	margin-bottom: 16px;
}
.roshd-student-card h3 {
	margin: 0 0 6px;
	color: var(--roshd-purple-dark);
}
.roshd-student-meta {
	font-size: 13px;
	color: #555;
	margin: 0 0 12px;
}
.roshd-status-badge {
	background: var(--roshd-bg-soft);
	border: 1px solid var(--roshd-border);
	border-radius: 20px;
	padding: 2px 10px;
	font-size: 12px;
}
.roshd-payment-badge {
	background: #fff4e5;
	border-color: #f0c36d;
	color: #7a5000;
}
.roshd-empty-note {
	color: #777;
	font-style: italic;
}
.roshd-student-picker {
	margin-bottom: 4px;
}
input.roshd-student-search {
	background-image: none;
}
.roshd-readonly-field[readonly] {
	background: #f0f0f1;
	color: #666;
	cursor: not-allowed;
}

.roshd-table {
	width: 100%;
	border-collapse: collapse;
	margin-top: 8px;
	font-size: 14px;
}
.roshd-table th,
.roshd-table td {
	border: 1px solid var(--roshd-border) !important;
	padding: 8px 10px !important;
	text-align: right;
}
.roshd-table thead th {
	background: var(--roshd-purple) !important;
	color: #fff !important;
}
.roshd-table tbody tr:nth-child(even) {
	background: var(--roshd-bg-soft);
}

/* -------------------- کادر آموزشی -------------------- */
.roshd-staff-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin: 20px 0;
}
.roshd-staff-grid.roshd-cols-1 { grid-template-columns: repeat(1, 1fr); }
.roshd-staff-grid.roshd-cols-2 { grid-template-columns: repeat(2, 1fr); }
.roshd-staff-grid.roshd-cols-4 { grid-template-columns: repeat(4, 1fr); }
.roshd-staff-card {
	background: #fff;
	border: 1px solid var(--roshd-border);
	border-radius: var(--roshd-radius);
	padding: 18px;
	text-align: center;
}
.roshd-staff-photo img {
	width: 110px;
	height: 110px;
	object-fit: cover;
	border-radius: 50%;
	margin: 0 auto 12px;
}
.roshd-staff-photo-placeholder {
	width: 110px;
	height: 110px;
	line-height: 110px;
	font-size: 46px;
	border-radius: 50%;
	background: var(--roshd-bg-soft);
	margin: 0 auto 12px;
}
.roshd-staff-name {
	margin: 0 0 4px;
	color: var(--roshd-purple-dark);
}
.roshd-staff-position {
	color: var(--roshd-teal);
	font-weight: 700;
	font-size: 13px;
	margin: 0 0 8px;
}
.roshd-staff-bio {
	font-size: 13px;
	color: #555;
	line-height: 1.9;
}

/* -------------------- رویدادها -------------------- */
.roshd-events-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 20px 0;
}
.roshd-event-item {
	display: flex;
	gap: 16px;
	background: #fff;
	border: 1px solid var(--roshd-border);
	border-radius: var(--roshd-radius);
	padding: 14px 16px;
}
.roshd-event-date {
	flex: 0 0 auto;
	background: var(--roshd-purple);
	color: #fff;
	border-radius: 8px;
	padding: 8px 12px;
	font-weight: 700;
	font-size: 13px;
	align-self: flex-start;
	white-space: nowrap;
}
.roshd-event-title {
	margin: 0 0 4px;
	color: var(--roshd-purple-dark);
}
.roshd-event-location,
.roshd-event-desc {
	margin: 2px 0;
	font-size: 13px;
	color: #555;
}

/* -------------------- شمارنده آمار -------------------- */
.roshd-stat-box {
	text-align: center;
	padding: 14px;
}
.roshd-stat-number {
	font-size: 42px;
	font-weight: 800;
	color: var(--roshd-purple);
	line-height: 1.2;
}
.roshd-stat-label {
	margin-top: 6px;
	font-size: 14px;
	color: #555;
}

/* -------------------- دکمه شناور واتس‌اپ -------------------- */
.roshd-whatsapp-float {
	position: fixed;
	bottom: 24px;
	left: 24px;
	z-index: 9999;
	width: 56px;
	height: 56px;
	background: #25d366;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
	transition: transform 0.15s ease;
}
.roshd-whatsapp-float:hover {
	transform: scale(1.08);
}

/* -------------------- پیشخوان مدیریت -------------------- */
.roshd-admin-cards {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin: 16px 0 24px;
}
.roshd-admin-card {
	background: #fff;
	border: 1px solid var(--roshd-border);
	border-radius: var(--roshd-radius);
	padding: 18px 24px;
	min-width: 160px;
	text-align: center;
}
.roshd-admin-card-number {
	font-size: 32px;
	font-weight: 800;
	color: var(--roshd-purple);
}
.roshd-admin-card-label {
	margin-top: 4px;
	font-size: 13px;
	color: #555;
}

/* -------------------- تقویم شمسی (انتخاب‌گر تاریخ) -------------------- */
.roshd-jalali-date {
	box-sizing: border-box;
	cursor: pointer;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235c2d91' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: left 10px center;
	background-size: 18px 18px;
	padding-left: 36px;
}

.roshd-dp-popup,
.roshd-dp-popup * {
	/* این ویجت باید مستقل از این‌که داخل .roshd-form/.roshd-box سایت یا داخل باکس اطلاعاتی
	   خودِ پیشخوان وردپرس (که box-sizing:border-box عمومی سایت را ندارد) قرار می‌گیرد، همیشه
	   عرض یکسان و قابل پیش‌بینی داشته باشد؛ برای همین box-sizing را خودش تعیین می‌کند، نه ارثی.
	   !important چون همهٔ سلول‌های این ویجت (روزها/ماه‌ها/سال‌ها/دکمه‌های ناوبری) واقعاً عنصر
	   <button> هستند و بدون آن، استایل عمومیِ «button» قالب فعال سایت می‌تواند box-sizing را هم
	   عوض کند و اندازهٔ سلول‌ها را با بقیهٔ گرید ناهماهنگ کند. */
	box-sizing: border-box !important;
}
.roshd-dp-popup {
	position: absolute;
	top: calc(100% + 4px);
	right: 0;
	z-index: 100;
	/* عرض پاپ‌آپ همیشه دقیقاً برابر عرض همان کادر/فیلدی است که به آن متصل است (نه یک عدد ثابت
	   کوچک‌تر) — چون هر عدد ثابتی که از عرض واقعی فیلد کمتر باشد، لبهٔ فیلدهای بعدی (که در همان
	   ردیف/زیر آن قرار دارند) را از کنار پاپ‌آپ بیرون نگه می‌دارد و آن حس «به‌هم‌ریختگی» را می‌سازد؛
	   وقتی عرض پاپ‌آپ دقیقاً با عرض کادر یکی باشد، هیچ لبه‌ای از فیلدهای بعدی کنارش دیده نمی‌شود.
	   min-width فقط برای این‌که در کادرهای فوق‌العاده باریک، تقویم کاملاً غیرقابل‌استفاده نشود؛
	   max-width هم فقط یک ضامن نهایی در برابر ویوپورت است (روی فرم‌های معمولی هیچ‌وقت فعال نمی‌شود). */
	width: 100%;
	min-width: 220px;
	max-width: 90vw;
	background: #fff;
	border: 1px solid var(--roshd-border);
	border-radius: var(--roshd-radius);
	box-shadow: 0 8px 24px rgba(44, 44, 44, 0.18);
	padding: 12px;
	direction: rtl;
	text-align: center;
	font-family: Tahoma, "Vazirmatn", "IRANSans", sans-serif;
}
.roshd-dp-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 8px;
}
.roshd-dp-title {
	font-weight: 700;
	font-size: 14px;
	color: var(--roshd-purple-dark);
}
.roshd-dp-title-btn {
	background: none !important;
	border: 1px solid transparent !important;
	border-radius: 6px !important;
	font-family: inherit !important;
	padding: 3px 10px !important;
	cursor: pointer;
}
.roshd-dp-title-btn:hover {
	background: var(--roshd-bg-soft) !important;
	border-color: var(--roshd-border) !important;
}
.roshd-dp-nav {
	background: var(--roshd-bg-soft) !important;
	border: 1px solid var(--roshd-border) !important;
	border-radius: 6px !important;
	width: 28px !important;
	height: 28px !important;
	line-height: 26px !important;
	text-align: center;
	cursor: pointer;
	font-size: 11px !important;
	color: var(--roshd-purple) !important;
	padding: 0 !important;
}
.roshd-dp-nav:hover {
	background: var(--roshd-purple) !important;
	color: #fff !important;
}
.roshd-dp-weekdays {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	margin-bottom: 4px;
}
.roshd-dp-weekdays span {
	display: block;
	font-size: 11px;
	font-weight: 700;
	color: #777;
	padding: 4px 0;
}
.roshd-dp-days {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 2px;
}
.roshd-dp-day {
	background: none !important;
	border: 1px solid transparent !important;
	border-radius: 6px !important;
	padding: 6px 0 !important;
	font-size: 13px !important;
	font-family: inherit !important;
	cursor: pointer;
	color: var(--roshd-text) !important;
}
.roshd-dp-day:hover {
	background: var(--roshd-bg-soft) !important;
	border-color: var(--roshd-border) !important;
}
.roshd-dp-today {
	border-color: var(--roshd-teal) !important;
	font-weight: 700 !important;
	color: var(--roshd-teal) !important;
}
.roshd-dp-selected,
.roshd-dp-selected:hover {
	background: var(--roshd-purple) !important;
	border-color: var(--roshd-purple) !important;
	color: #fff !important;
	font-weight: 700 !important;
}
.roshd-dp-empty {
	display: block;
}
.roshd-dp-months,
.roshd-dp-years {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4px;
}
.roshd-dp-month,
.roshd-dp-year {
	background: none !important;
	border: 1px solid transparent !important;
	border-radius: 6px !important;
	padding: 10px 2px !important;
	font-size: 13px !important;
	font-family: inherit !important;
	cursor: pointer;
	color: var(--roshd-text) !important;
}
.roshd-dp-month:hover,
.roshd-dp-year:hover {
	background: var(--roshd-bg-soft) !important;
	border-color: var(--roshd-border) !important;
}
.roshd-dp-footer {
	display: flex;
	justify-content: space-between;
	margin-top: 10px;
	padding-top: 8px;
	border-top: 1px solid var(--roshd-border);
}
.roshd-dp-today-btn,
.roshd-dp-clear-btn {
	background: none !important;
	border: none !important;
	font-family: inherit !important;
	color: var(--roshd-purple) !important;
	font-size: 12px !important;
	cursor: pointer;
	padding: 4px 6px !important;
	font-weight: 700 !important;
}
.roshd-dp-today-btn:hover,
.roshd-dp-clear-btn:hover {
	text-decoration: underline;
}
.roshd-dp-clear-btn {
	color: #888 !important;
	font-weight: 400 !important;
}

/* -------------------- سیستم تیکت -------------------- */
.roshd-btn-secondary {
	background: #fff !important;
	color: var(--roshd-purple) !important;
	border: 1px solid var(--roshd-purple) !important;
}
.roshd-btn-secondary:hover {
	background: var(--roshd-bg-soft) !important;
}
.roshd-btn-small {
	padding: 5px 14px !important;
	font-size: 13px !important;
	font-weight: 400 !important;
}
.roshd-field-inline {
	flex-direction: row;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}
.roshd-field-inline label {
	margin: 0;
}
.roshd-field-inline select {
	width: auto;
}
.roshd-tickets-section {
	margin-top: 28px;
	padding-top: 20px;
	border-top: 2px solid var(--roshd-border);
}
.roshd-field-note {
	color: #6b6b6b;
	font-size: 13px;
	margin: -4px 0 12px;
}
.roshd-tickets-table td a {
	color: var(--roshd-purple);
	font-weight: 700;
	text-decoration: none;
}
.roshd-tickets-table td a:hover {
	text-decoration: underline;
}
.roshd-ticket-back {
	margin-bottom: 4px;
}
.roshd-ticket-detail-header h3 {
	margin: 0 0 6px;
	color: var(--roshd-purple-dark);
}
.roshd-ticket-meta {
	font-size: 13px;
	color: #555;
	margin: 0 0 18px;
}
.roshd-ticket-thread {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-bottom: 20px;
}
.roshd-ticket-msg {
	background: #fff;
	border: 1px solid var(--roshd-border);
	border-right: 4px solid var(--roshd-purple);
	border-radius: var(--roshd-radius);
	padding: 12px 16px;
}
.roshd-ticket-msg-teacher {
	border-right-color: var(--roshd-teal);
	background: var(--roshd-bg-soft);
}
.roshd-ticket-msg-meta {
	font-size: 12px;
	color: #666;
	margin-bottom: 6px;
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}
.roshd-ticket-msg-role {
	color: var(--roshd-purple);
}
.roshd-ticket-msg-teacher .roshd-ticket-msg-role {
	color: var(--roshd-teal);
}
.roshd-ticket-msg-date {
	color: #999;
	margin-right: auto;
}
.roshd-ticket-msg-text {
	font-size: 14px;
	line-height: 1.9;
	white-space: pre-line;
}
.roshd-ticket-status-form {
	max-width: none;
	background: var(--roshd-bg-soft);
	margin-bottom: 16px;
	padding: 14px 16px;
}
.roshd-ticket-reply-form {
	max-width: none;
}

/* -------------------- ریسپانسیو / موبایل -------------------- */
@media (max-width: 782px) {
	.roshd-staff-grid,
	.roshd-staff-grid.roshd-cols-2,
	.roshd-staff-grid.roshd-cols-3,
	.roshd-staff-grid.roshd-cols-4 {
		grid-template-columns: repeat(2, 1fr);
	}
	.roshd-form {
		padding: 16px;
	}
	.roshd-whatsapp-float {
		width: 50px;
		height: 50px;
		bottom: 16px;
		left: 16px;
	}
}

@media (max-width: 480px) {
	.roshd-staff-grid,
	.roshd-staff-grid.roshd-cols-2,
	.roshd-staff-grid.roshd-cols-3,
	.roshd-staff-grid.roshd-cols-4 {
		grid-template-columns: repeat(1, 1fr);
	}
	.roshd-event-item {
		flex-direction: column;
	}
	.roshd-table {
		font-size: 12px;
	}
	.roshd-panel-header {
		flex-direction: column;
		align-items: flex-start;
		gap: 6px;
	}
	.roshd-dp-popup {
		/* عرض ثابتی این‌جا تحمیل نمی‌شود — همان width:100% نسبت به کادر در حالت پایه، روی موبایل
		   هم به‌خودی‌خود درست کار می‌کند؛ یک عدد ثابت این‌جا دوباره همان مشکل بیرون‌زدگی/جامانده را
		   می‌ساخت (چون عرض واقعی کادر روی صفحه‌های مختلف موبایل متفاوت است). */
		padding: 8px;
	}
	.roshd-dp-day {
		padding: 5px 0;
		font-size: 12px;
	}
	.roshd-dp-month,
	.roshd-dp-year {
		padding: 8px 0;
		font-size: 12px;
	}
	.roshd-field-inline {
		flex-direction: column;
		align-items: flex-start;
	}
	.roshd-field-inline select {
		width: 100%;
	}
}