/* Loan Request – front-end (blue theme) */

.lr-app {
	--lr-primary: #1c6fd6;
	--lr-primary-dark: #14539f;
	--lr-primary-darker: #0f3f7a;
	--lr-primary-light: #eaf3fe;
	--lr-primary-lighter: #f4f9ff;
	--lr-border: #cfe1f6;
	--lr-text: #17324d;
	--lr-muted: #5b7085;
	--lr-danger: #d63638;
	--lr-radius: 12px;

	color: var( --lr-text );
	direction: rtl;
	text-align: right;
	font-size: 15px;
	line-height: 1.8;
	margin: 0 auto;
}

.lr-app *,
.lr-app *::before,
.lr-app *::after {
	box-sizing: border-box;
}

.lr-empty {
	background: var( --lr-primary-light );
	border: 1px solid var( --lr-border );
	border-radius: var( --lr-radius );
	padding: 20px;
	text-align: center;
}

/* ---------- Pricing plans ---------- */
.lr-plans {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin: 8px 0 28px;
}

.lr-plan {
	flex: 1 1 240px;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var( --lr-border );
	border-radius: var( --lr-radius );
	overflow: hidden;
	box-shadow: 0 6px 18px rgba( 28, 111, 214, 0.08 );
	transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.lr-plan:hover {
	transform: translateY( -3px );
	box-shadow: 0 12px 26px rgba( 28, 111, 214, 0.16 );
}

.lr-plan.is-selected {
	border-color: var( --lr-primary );
	box-shadow: 0 0 0 3px rgba( 28, 111, 214, 0.25 );
}

.lr-plan__head {
	background: linear-gradient( 135deg, var( --lr-primary ), var( --lr-primary-dark ) );
	color: #fff;
	padding: 18px 16px;
	text-align: center;
}

.lr-plan__title {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	color: #fff;
}

.lr-plan__info {
	list-style: none;
	margin: 0;
	padding: 16px;
	flex: 1;
}

.lr-plan__info li {
	position: relative;
	padding: 8px 22px 8px 0;
	border-bottom: 1px dashed #e3e8ef;
	font-size: 14px;
}

.lr-plan__info li:last-child {
	border-bottom: 0;
}

.lr-plan__info li::before {
	content: "";
	position: absolute;
	right: 0;
	top: 15px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var( --lr-primary );
}

.lr-plan__foot {
	padding: 16px;
	text-align: center;
	border-top: 1px solid #eef2f7;
}

.lr-btn {
	display: inline-block;
	background: var( --lr-primary );
	color: #fff;
	border: 0;
	border-radius: 8px;
	padding: 11px 26px;
	font-size: 15px;
	font-weight: 600;
	font-family: inherit;
	cursor: pointer;
	transition: background 0.15s ease;
}

.lr-btn:hover {
	background: var( --lr-primary-dark );
}

.lr-plan__select {
	width: 100%;
}

/* Tablet: 2 per row, but a single loan fills the row. */
@media ( min-width: 560px ) and ( max-width: 899px ) {
	.lr-plans .lr-plan {
		max-width: calc( ( 100% - 20px ) / 2 );
	}

	.lr-plans[data-count="1"] .lr-plan {
		max-width: 100%;
	}
}

/* Desktop: up to 4 per row; fewer than 4 loans stretch to fill the row. */
@media ( min-width: 900px ) {
	.lr-plans .lr-plan {
		max-width: calc( ( 100% - 60px ) / 4 );
	}

	.lr-plans[data-count="1"] .lr-plan {
		max-width: 100%;
	}

	.lr-plans[data-count="2"] .lr-plan {
		max-width: calc( ( 100% - 20px ) / 2 );
	}

	.lr-plans[data-count="3"] .lr-plan {
		max-width: calc( ( 100% - 40px ) / 3 );
	}
}

/* ---------- Steps ---------- */
.lr-step {
	margin: 22px 0;
}

.lr-step--duration {
	background: var( --lr-primary-lighter );
	border: 1px solid var( --lr-border );
	border-radius: var( --lr-radius );
	padding: 18px 20px;
}

.lr-select,
.lr-control {
	width: 100%;
	max-width: 420px;
	padding: 10px 12px;
	border: 1px solid #c4d4e8;
	border-radius: 8px;
	font-family: inherit;
	font-size: 15px;
	background: #fff;
	color: var( --lr-text );
}

.lr-control:focus,
.lr-select:focus {
	outline: none;
	border-color: var( --lr-primary );
	box-shadow: 0 0 0 3px rgba( 28, 111, 214, 0.18 );
}

.lr-field__label {
	display: block;
	font-weight: 600;
	margin-bottom: 6px;
}

/* ---------- Amounts table ---------- */
.lr-table-wrap {
	margin: 20px 0;
	overflow-x: auto;
}

.lr-table-title {
	margin: 0 0 10px;
	font-size: 18px;
	color: var( --lr-primary-darker );
	text-align: center;
}

.lr-table {
	width: 100%;
	border-collapse: collapse;
	background: #fff;
	border: 1px solid var( --lr-border );
	border-radius: var( --lr-radius );
	overflow: hidden;
	min-width: 480px;
}

.lr-table th,
.lr-table td {
	padding: 12px 14px;
	text-align: center;
	border-bottom: 1px solid #e7eef7;
}

.lr-table thead th {
	background: var( --lr-primary );
	color: #fff;
	font-weight: 700;
}

.lr-table tbody tr:nth-child( even ) {
	background: var( --lr-primary-lighter );
}

.lr-table tbody tr:last-child td {
	border-bottom: 0;
}

/* ---------- Loan description ---------- */
.lr-loan-desc {
	background: var( --lr-primary-lighter );
	border: 1px solid var( --lr-border );
	border-right: 4px solid var( --lr-primary );
	border-radius: 10px;
	padding: 14px 18px;
	margin: 18px 0;
	font-size: 14px;
}

.lr-loan-desc p:first-child {
	margin-top: 0;
}

.lr-loan-desc p:last-child {
	margin-bottom: 0;
}

/* ---------- Form ---------- */
.lr-form {
	background: #fff;
	border: 1px solid var( --lr-border );
	border-radius: var( --lr-radius );
	padding: 22px;
	margin-top: 18px;
	display: grid;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	gap: 16px 20px;
}

.lr-field {
	min-width: 0;
}

.lr-field--textarea,
.lr-field--description,
.lr-field--amount,
.lr-form__error,
.lr-form__submit {
	grid-column: 1 / -1;
}

.lr-field .lr-control {
	max-width: 100%;
}

.lr-field__flag {
	display: inline-block;
	margin-right: 8px;
	font-size: 11px;
	font-weight: 600;
	padding: 1px 8px;
	border-radius: 999px;
	vertical-align: middle;
}

.lr-field__flag.is-required {
	background: #fdeaea;
	color: var( --lr-danger );
}

.lr-field__flag.is-optional {
	background: #eef2f7;
	color: var( --lr-muted );
}

.lr-field__desc {
	margin: 6px 0 0;
	font-size: 12px;
	color: var( --lr-muted );
}

.lr-field__msg {
	margin: 5px 0 0;
	font-size: 12px;
	color: var( --lr-danger );
	min-height: 0;
}

.lr-field.has-error .lr-control {
	border-color: var( --lr-danger );
	box-shadow: 0 0 0 3px rgba( 214, 54, 56, 0.15 );
}

.lr-amount-note {
	color: var( --lr-primary-dark );
	font-weight: 600;
}

.lr-control--file {
	padding: 8px;
	background: var( --lr-primary-lighter );
}

.lr-form__error {
	background: #fdeaea;
	border: 1px solid #f3c2c3;
	color: #a5282a;
	border-radius: 8px;
	padding: 12px 14px;
	font-size: 14px;
}

.lr-inactive-notice {
	margin: 18px 0;
	text-align: center;
	font-weight: 600;
}

.lr-form__submit {
	text-align: center;
	margin-top: 6px;
}

.lr-btn--submit {
	min-width: 220px;
	padding: 13px 30px;
	font-size: 16px;
}

.lr-btn--submit:disabled {
	opacity: 0.7;
	cursor: default;
}

/* ---------- Success ---------- */
.lr-success {
	text-align: center;
	background: #fff;
	border: 1px solid var( --lr-border );
	border-top: 5px solid var( --lr-primary );
	border-radius: var( --lr-radius );
	padding: 34px 22px;
}

.lr-success__icon {
	width: 62px;
	height: 62px;
	line-height: 62px;
	margin: 0 auto 14px;
	border-radius: 50%;
	background: var( --lr-primary );
	color: #fff;
	font-size: 32px;
}

.lr-success__code {
	font-size: 18px;
	margin-top: 10px;
}

.lr-success__code strong {
	display: inline-block;
	background: var( --lr-primary-light );
	color: var( --lr-primary-darker );
	padding: 4px 16px;
	border-radius: 8px;
	letter-spacing: 2px;
	font-size: 22px;
}

.lr-success__note {
	max-width: 520px;
	margin: 14px auto 0;
	padding: 12px 16px;
	background: var( --lr-primary-lighter );
	border: 1px dashed var( --lr-border );
	border-radius: 10px;
	font-size: 14px;
	line-height: 1.9;
	color: var( --lr-muted );
}

/* After a successful submission only the confirmation box remains. */
.lr-app.lr-submitted .lr-plans,
.lr-app.lr-submitted .lr-step--duration {
	display: none;
}

/* ---------- Responsive ---------- */
@media ( max-width: 680px ) {
	.lr-form {
		grid-template-columns: 1fr;
		padding: 16px;
	}
}

/* JalaliDatepicker sits above everything */
jdp-container {
	z-index: 99999;
}