<div class="card card-custom">
								<div class="card-header">
									<h3 class="card-title">
										نمونه های پایه
									</h3>
								</div>
								<!--begin::Form-->
								<form class="form">
									<div class="card-body">
										<div class="form-group">
											<div class="alert alert-custom alert-default" role="alert">
												<div class="alert-icon"><i class="flaticon-warning text-primary"></i></div>
												<div class="alert-text">
													استفاده از از ایکون و نماد در اینپوت گروپ فرم <a  class="font-weight-bold" href="<?php echo Util::getUrl( 'components/icons/flaticon' ) ?>">Flaticon</a>,
													<a  class="font-weight-bold" href="<?php echo Util::getUrl( 'components/icons/fontawesome5' ) ?>">Fontawesome 5</a>,
													<a  class="font-weight-bold" href="<?php echo Util::getUrl( 'components/icons/duo-tone' ) ?>">Duotone</a>,
													<a  class="font-weight-bold" href="<?php echo Util::getUrl( 'components/icons/lineawesome' ) ?>">Fontawesome</a> or
													<a  class="font-weight-bold" href="<?php echo Util::getUrl( 'components/icons/socicons' ) ?>">Socicons</a> icons.
												</div>
											</div>
										</div>
										<div class="form-group">
											<label>افزوده شده در راست</label>
											<div class="input-group">
												<div class="input-group-prepend"><span class="input-group-text">@</span></div>
												<input type="text" class="form-control" placeholder="پست الکترونیک" />
											</div>
											<span class="form-text text-muted">در اینجا می توانید توضیحات بنویسید</span>
										</div>
										<div class="form-group">
											<label>افزوده شده در چپ</label>
											<div class="input-group">
												<input type="text" class="form-control" placeholder="نام کاربری" aria-describedby="basic-addon2"/>
												<div class="input-group-append"><span class="input-group-text">@example.com</span></div>
											</div>
										</div>
										<div class="separator separator-dashed my-8"></div>
										<div class="form-group">
											<label>افزوده دوتایی</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<span class="input-group-text">دلار</span>
													<span class="input-group-text">0.00</span>
												</div>
												<input type="text" class="form-control" aria-label="Amount (to the nearest dollar)"/>
											</div>
										</div>
										<div class="form-group mb-2">
											<label>راست & افزوده شده در چپs</label>
											<div class="input-group">
												<div class="input-group-prepend"><span class="input-group-text">#</span></div>
												<input type="text" class="form-control" placeholder="واحد" />
												<div class="input-group-append"><span class="input-group-text">px</span></div>
											</div>
										</div>
									</div>
									<div class="card-footer">
										<button type="reset" class="btn btn-primary mr-2">ارسال</button>
										<button type="reset" class="btn btn-secondary">لغو</button>
									</div>
								</form>
								<!--end::Form-->
							</div>
						

							<div class="card card-custom">
								<div class="card-header">
									<h3 class="card-title">
										همراه با آیکون
									</h3>
								</div>
								<!--begin::Form-->
								<form class="form">
									<div class="card-body">
										<div class="form-group">
											<div class="alert alert-custom alert-default" role="alert">
												<div class="alert-icon"><?php echo Page::getSVG(Page::getMediaPath() . "svg/icons/ابزارها/Compass.svg", "svg-icon-primary svg-icon-xl");?></div>
												<div class="alert-text">
													با افزودن متن ، دکمه ها ، آیکون ها ، یا گروه های دکمه در هر طرف ورودی ، به راحتی کنترل فرم ها را گسترش دهید.
												</div>
											</div>
										</div>
										<div class="form-group">
											<label>افزوده شده در راست</label>
											<div class="input-group">
												<div class="input-group-prepend"><span class="input-group-text"><i class="la la-exclamation-triangle icon-lg"></i></span></div>
												<input type="text" class="form-control" placeholder="پست الکترونیک" />
											</div>
											<span class="form-text text-muted">در اینجا می توانید توضیحات بنویسید</span>
										</div>
										<div class="form-group">
											<label>افزوده شده در چپ</label>
											<div class="input-group">
												<input type="text" class="form-control" placeholder="نام کاربری" aria-describedby="basic-addon2"/>
												<div class="input-group-append"><span class="input-group-text"><i class="la la-group icon-lg"></i></span></div>
											</div>
										</div>

										<div class="separator separator-dashed my-8"></div>

										<div class="form-group">
											<label>افزوده دوتایی</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<span class="input-group-text">دلار</span>
												</div>
												<input type="text" class="form-control" placeholder="0.00" aria-label="Amount (to the nearest dollar)"/>
												<div class="input-group-append">
													<span class="input-group-text"><i class="la la-registered"></i></span>
												</div>
											</div>
										</div>
										<div class="form-group">
											<label>افزوده دو طرفه</label>
											<div class="input-group">
												<div class="input-group-prepend"><span class="input-group-text"><i class="flaticon-refresh"></i></span></div>
												<input type="text" class="form-control" placeholder="نام کاربری" aria-describedby="basic-addon2"/>
												<div class="input-group-append"><span class="input-group-text"><i class="flaticon-user"></i></span></div>
											</div>
										</div>
										<div class="form-group">
											<label>دووتون</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<span class="input-group-text line-height-0 py-0">
														<?php echo Page::getSVG(Page::getMediaPath() . "svg/icons/عمومی/جستجو.svg");?>
													</span>
												</div>
												<input type="text" class="form-control" placeholder="نام کاربری" aria-describedby="basic-addon2"/>
												<div class="input-group-append">
													<span class="input-group-text line-height-0 py-0">
														<?php echo Page::getSVG(Page::getMediaPath() . "svg/icons/کد/Compiling.svg");?>
													</span>
												</div>
											</div>
										</div>
										<div class="form-group mb-2">
											<label>آیکون کین تم</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<span class="input-group-text line-height-0 py-0">
														<i class="ki ki-arrow-back icon-sm"></i>
													</span>
												</div>
												<input type="text" class="form-control" placeholder="نام کاربری" aria-describedby="basic-addon2"/>
												<div class="input-group-append">
													<span class="input-group-text line-height-0 py-0">
														<i class="ki ki-arrow-next icon-sm"></i>
													</span>
												</div>
											</div>
										</div>
									</div>
									<div class="card-footer">
										<button type="reset" class="btn btn-primary mr-2">ارسال</button>
										<button type="reset" class="btn btn-secondary">لغو</button>
									</div>
								</form>
								<!--end::Form-->
							</div>
						

							<div class="card card-custom">
								<div class="card-header">
									<h3 class="card-title">
										اندازه های مختلف
									</h3>
								</div>
								<!--begin::Form-->
								<form class="form">
									<div class="card-body">
										<div class="form-group">
											<div class="alert alert-custom alert-default" role="alert">
												<div class="alert-icon"><i class="flaticon-warning text-primary"></i></div>
												<div class="alert-text">
													کلاس های نسبی اندازه به کلاس اضافه کنید <code>.input-group</code> خود و محتویات درون
													به طور خودکار تغییر اندازه خواهد کرد
												</div>
											</div>
										</div>
										<div class="form-group">
											<label>اینپوت بزرگ گروه</label>
											<div class="input-group input-group-lg">
												<div class="input-group-prepend"><span class="input-group-text"><i class="la la-exclamation-triangle "></i></span></div>
												<input type="text" class="form-control" placeholder="اندازه بزرگ" />
											</div>
											<span class="form-text text-muted">در اینجا می توانید توضیحات بنویسید</span>
										</div>
										<div class="form-group">
											<label>اینپوت بزرگ گروه</label>
											<div class="input-group input-group-lg">
												<div class="input-group-prepend">
													<span class="input-group-text"><i class="flaticon-refresh"></i></span>
													<span class="input-group-text">0.00</span>
												</div>
												<input type="text" class="form-control" aria-label="اندازه بزرگ"/>
											</div>
										</div>
										<div class="form-group">
											<label>اینپوت کوچک گروه</label>
											<div class="input-group input-group-sm">
												<input type="text" class="form-control" placeholder="اندازه کوچک" aria-describedby="basic-addon2"/>
												<div class="input-group-append"><span class="input-group-text"><i class="la la-group"></i></span></div>
											</div>
										</div>
										<div class="form-group">
											<label>اینپوت کوچک گروه</label>
											<div class="input-group input-group-sm">
												<div class="input-group-prepend"><span class="input-group-text"><i class="fa fa-paper-plane" aria-hidden="true"></i></span></div>
												<input type="text" class="form-control" placeholder="اندازه کوچک" aria-describedby="basic-addon2"/>
											</div>
										</div>
										<div class="form-group mb-2">
											<label>اینپوت کوچک گروه</label>
											<div class="input-group input-group-sm">
												<div class="input-group-prepend"><span class="input-group-text"><i class="fa fa-paper-plane" aria-hidden="true"></i></span></div>
												<input type="text" class="form-control" placeholder="اندازه کوچک" aria-describedby="basic-addon2"/>
												<div class="input-group-append"><span class="input-group-text"><i class="la la-group"></i></span></div>
											</div>
										</div>
									</div>
									<div class="card-footer">
										<button type="reset" class="btn btn-primary mr-2">ارسال</button>
										<button type="reset" class="btn btn-secondary">لغو</button>
									</div>
								</form>
								<!--end::Form-->
							</div>
						

							<div class="card card-custom">
								<div class="card-header">
									<h3 class="card-title">
										اینپوت های همراه با چک باکس و رادیو باکس
									</h3>
								</div>
								<!--begin::Form-->
								<form class="form">
									<div class="card-body">
										<div class="form-group">
											<div class="alert alert-custom alert-default" role="alert">
												<div class="alert-icon"><i class="flaticon-warning text-primary"></i></div>
												<div class="alert-text">
													می توانید در اینپوت چک باکس و رادیو باکس قرار دهید
												</div>
											</div>
										</div>
										<div class="form-group">
											<label>افزوده چک باکس در راست</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<span class="input-group-text">
														<label class="checkbox checkbox-inline checkbox-success">
															<input type="checkbox" checked=""/>
															<span></span>
														</label>
													</span>
													<span class="input-group-text">دلار</span>
												</div>
												<input type="text" class="form-control" aria-label="متن input with checkbox"/>
											</div>
										</div>
										<div class="form-group">
											<label>چک باکس در سمت چپ</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<span class="input-group-text">دلار</span>
												</div>
												<input type="text" class="form-control" aria-label="متن input with checkbox"/>
												<div class="input-group-append">
													<span class="input-group-text">
														<label class="checkbox checkbox-inline checkbox-primary">
															<input type="checkbox" checked=""/>
															<span></span>
														</label>
													</span>
												</div>
											</div>
										</div>
										<div class="form-group">
											<label>چپ & افزوده چک باکس در راست</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<span class="input-group-text">
														<label class="checkbox checkbox-inline">
															<input type="checkbox" checked="checked"/>
															<span></span>
														</label>
													</span>
												</div>
												<input type="text" class="form-control" aria-label="متن input with checkbox"/>
												<div class="input-group-append">
													<span class="input-group-text">
														<label class="checkbox checkbox-inline">
															<input type="checkbox"/>
															<span></span>
														</label>
													</span>
												</div>
											</div>
										</div>
										<div class="form-group">
											<label>رادیو در سمت راست</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<span class="input-group-text">
														<label class="radio radio-single radio-success">
															<input type="radio" checked=""/>
															<span></span>
														</label>
													</span>
													<span class="input-group-text">دلار</span>
												</div>
												<input type="text" class="form-control" aria-label="متن input with radio"/>
											</div>
										</div>
										<div class="form-group">
											<label>رادیو باکس در چپ</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<span class="input-group-text">دلار</span>
												</div>
												<input type="text" class="form-control" aria-label="متن input with radio"/>
												<div class="input-group-append">
													<span class="input-group-text">
														<label class="radio radio-single radio-primary">
															<input type="radio" checked=""/>
															<span></span>
														</label>
													</span>
												</div>
											</div>
										</div>
										<div class="form-group mb-2">
											<label>چپ & رادیو در سمت راست</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<span class="input-group-text">
														<label class="radio radio-single">
															<input type="radio"/>
															<span></span>
														</label>
													</span>
												</div>
												<input type="text" class="form-control" aria-label="متن input with radio"/>
												<div class="input-group-append">
													<span class="input-group-text">
														<label class="radio radio-single">
															<input type="radio"/>
															<span></span>
														</label>
													</span>
												</div>
											</div>
										</div>
									</div>
									<div class="card-footer">
										<button type="reset" class="btn btn-primary mr-2">ارسال</button>
										<button type="reset" class="btn btn-secondary">لغو</button>
									</div>
								</form>
								<!--end::Form-->
							</div>
						

							<div class="card card-custom">
								<div class="card-header">
									<h3 class="card-title">
										افزوده دکمه
									</h3>
								</div>
								<!--begin::Form-->
								<form class="form">
									<div class="card-body">
										<div class="form-group">
											<div class="alert alert-custom alert-default" role="alert">
												<div class="alert-icon"><i class="flaticon-warning text-primary"></i></div>
												<div class="alert-text">
													اینپوت با دکمه  <code>.input-group-prepend</code> or <code>.input-group-append</code> برای تراز و اندازه مناسب
												این به دلیل سبکهای پیش فرض مرورگر است که نمی توان از آن استفاده کرد.
												</div>
											</div>
										</div>
										<div class="form-group">
											<label>افزوده شده در راست دکمه</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<button class="btn btn-secondary" type="button">برو!</button>
												</div>
												<input type="text" class="form-control" placeholder="جستجو ..."/>
											</div>
										</div>
										<div class="form-group">
											<label>افزوده شده در چپ دکمه</label>
											<div class="input-group">
												<input type="text" class="form-control" placeholder="جستجو ..."/>
												<div class="input-group-append">
													<button class="btn btn-secondary" type="button">برو!</button>
												</div>
											</div>
										</div>
										<div class="form-group">
											<label>راست & افزوده شده در چپ دکمه</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<button class="btn btn-secondary" type="button">برو!</button>
												</div>
												<input type="text" class="form-control" placeholder="جستجو ..."/>
												<div class="input-group-append">
													<button class="btn btn-secondary" type="button">برو!</button>
												</div>
											</div>
										</div>
										<div class="form-group">
											<label>افزوده شده در راست دکمه</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<button class="btn btn-primary" type="button">برو!</button>
												</div>
												<input type="text" class="form-control" placeholder="جستجو ..."/>
											</div>
										</div>
										<div class="form-group">
											<label>افزوده شده در چپ دکمه</label>
											<div class="input-group">
												<input type="text" class="form-control" placeholder="جستجو ..."/>
												<div class="input-group-append">
													<button class="btn btn-primary" type="button">برو!</button>
												</div>
											</div>
										</div>
										<div class="form-group mb-2">
											<label>راست & افزوده شده در چپ دکمه</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<button class="btn btn-success" type="button">برو!</button>
												</div>
												<input type="text" class="form-control" placeholder="جستجو ..."/>
												<div class="input-group-append">
													<button class="btn btn-warning" type="button">برو!</button>
												</div>
											</div>
										</div>
									</div>
									<div class="card-footer">
										<button type="reset" class="btn btn-primary mr-2">ارسال</button>
										<button type="reset" class="btn btn-secondary">لغو</button>
									</div>
								</form>
								<!--end::Form-->
							</div>
						

							<div class="card card-custom">
								<div class="card-header">
									<h3 class="card-title">
										اینپوت با دکمه دراپ دان
									</h3>
								</div>
								<!--begin::Form-->
								<form class="form">
									<div class="card-body">
										<div class="form-group">
											<div class="alert alert-custom alert-default" role="alert">
												<div class="alert-icon"><i class="flaticon-warning text-primary"></i></div>
												<div class="alert-text">
													فرم مثال زیر عناصر فرم جی اس معمول را نشان می دهد که از کلاس های اضافی سبک های به روز شده را از بوت استرپ دریافت می کنند.
												</div>
											</div>
										</div>
										<div class="form-group">
											<label>دکمه دراپ دان در راست</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
													اکشن
													</button>
													<div class="dropdown-menu">
														<a class="dropdown-item" href="#">اکشن</a>
														<a class="dropdown-item" href="#">اکشن های دیگر</a>
														<a class="dropdown-item" href="#">سایر موارد</a>
														<div role="separator" class="dropdown-divider"></div>
														<a class="dropdown-item" href="#">جداکننده لینک</a>
													</div>
												</div>
												<input type="text" class="form-control" aria-label="متن input with dropdown button"/>
											</div>
											<span class="form-text text-muted">در اینجا می توانید توضیحات بنویسید</span>
										</div>
										<div class="form-group">
											<label>دکمه دراپ دان چپ</label>
											<div class="input-group">
												<input type="text" class="form-control" aria-label="متن input with dropdown button"/>
												<div class="input-group-append">
													<button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
													اکشن
													</button>
													<div class="dropdown-menu">
														<a class="dropdown-item" href="#">اکشن</a>
														<a class="dropdown-item" href="#">اکشن های دیگر</a>
														<a class="dropdown-item" href="#">سایر موارد</a>
														<div role="separator" class="dropdown-divider"></div>
														<a class="dropdown-item" href="#">جداکننده لینک</a>
													</div>
												</div>
											</div>
											<span class="form-text text-muted">در اینجا می توانید توضیحات بنویسید</span>
										</div>
										<div class="form-group mb-2">
											<label>راست & دکمه دراپ دان چپ</label>
											<div class="input-group">
												<div class="input-group-prepend">
													<button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
													اکشن
													</button>
													<div class="dropdown-menu">
														<a class="dropdown-item" href="#">اکشن</a>
														<a class="dropdown-item" href="#">اکشن های دیگر</a>
														<a class="dropdown-item" href="#">سایر موارد</a>
														<div role="separator" class="dropdown-divider"></div>
														<a class="dropdown-item" href="#">جداکننده لینک</a>
													</div>
												</div>
												<input type="text" class="form-control" aria-label="متن input with dropdown button"/>
												<div class="input-group-append">
													<button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
													اکشن
													</button>
													<div class="dropdown-menu">
														<a class="dropdown-item" href="#">اکشن</a>
														<a class="dropdown-item" href="#">اکشن های دیگر</a>
														<a class="dropdown-item" href="#">سایر موارد</a>
														<div role="separator" class="dropdown-divider"></div>
														<a class="dropdown-item" href="#">جداکننده لینک</a>
													</div>
												</div>
											</div>
											<span class="form-text text-muted">در اینجا می توانید توضیحات بنویسید</span>
										</div>
									</div>
									<div class="card-footer">
										<button type="reset" class="btn btn-primary mr-2">ارسال</button>
										<button type="reset" class="btn btn-secondary">لغو</button>
									</div>
								</form>
								<!--end::Form-->
							</div>