.woocommerce-checkout ul.payment_methods .payment_method_cartabin img,
.woocommerce-checkout ul.payment_methods li img[src*="cartabin"] {
	max-height: 26px;
	width: auto;
	max-width: 26px;
	vertical-align: middle;
	margin: 0 4px;
}

.cartabin-box,
.cartabin-box input,
.cartabin-box textarea,
.cartabin-box button{
	font-family:'IRANYekan','Tahoma',sans-serif !important;
}

.cartabin-box{
	--ap-navy:#001e4f;
	--ap-navy-light:#123368;
	--ap-green:#009e61;
	--ap-green-dark:#00814e;
	--ap-green-tint:#e6f7ef;
	--ap-border:#e3e8ef;

	width:100%;
	box-sizing:border-box;
	background:#fff;
	border:1px solid var(--ap-border);
	border-radius:18px;
	padding:16px;
	margin:12px 0;
	box-shadow:0 4px 24px rgba(16,24,40,.06);
	color:#1c2733;
}

.cartabin-box__title{
	margin:0 0 6px;
	font-size:17px;
	font-weight:800;
	color:var(--ap-navy);
}
.cartabin-box__instructions{
	font-size:13px;
	color:#6b7785;
	margin:0 0 18px;
}

.cartabin-card{
	background:linear-gradient(135deg, var(--ap-navy) 0%, var(--ap-navy-light) 100%);
	border-radius:16px;
	padding:22px 22px 18px;
	position:relative;
	overflow:hidden;
	margin-bottom:18px;
}
.cartabin-card::after{
	content:"";
	position:absolute;
	inset:0;
	background:radial-gradient(circle at 100% 0%, var(--ap-green) 0%, transparent 55%);
	opacity:.35;
	pointer-events:none;
}
.cartabin-card__bank{
	color:rgba(255,255,255,.7);
	font-size:12.5px;
	font-weight:600;
	margin-bottom:20px;
	position:relative;
}
.cartabin-card__row{
	display:flex;
	align-items:center;
	gap:10px;
	position:relative;
	margin-bottom:12px;
	flex-wrap:wrap;
}
.cartabin-card__row--sheba{ margin-bottom:16px; }
.cartabin-card__number{
	display:flex;
	align-items:center;
	gap:7px;
	direction:ltr;
	flex-wrap:wrap;
}
.cartabin-card__number span{
	color:#fff;
	font-size:19px;
	font-weight:600;
	letter-spacing:1px;
}
.cartabin-card__sheba{
	color:rgba(255,255,255,.92);
	font-size:13.5px;
	font-weight:600;
	letter-spacing:.5px;
	direction:ltr;
}
.cartabin-card__copy{
	margin-inline-start:auto;
	flex-shrink:0;
	background:rgba(255,255,255,.14);
	border:1px solid rgba(255,255,255,.25);
	color:#fff;
	font-size:11.5px;
	padding:6px 12px;
	border-radius:8px;
	cursor:pointer;
	white-space:nowrap;
}
.cartabin-card__copy:hover{ background:rgba(255,255,255,.22); }
.cartabin-card__copy.is-copied{ background:var(--ap-green); border-color:var(--ap-green); }
.cartabin-card__owner{
	color:rgba(255,255,255,.85);
	font-size:12.5px;
	position:relative;
}

.cartabin-final-amount{
	display:flex;
	align-items:baseline;
	justify-content:center;
	gap:8px;
	flex-wrap:wrap;
	text-align:center;
	padding:14px 18px;
	margin:6px 0;
	border-radius:16px;
	background:var(--ap-green-tint);
	animation:cartabin-amount-pulse 2.2s ease-in-out infinite;
}
@keyframes cartabin-amount-pulse{
	0%, 100%{ box-shadow:0 0 0 0 rgba(0,158,97,.28); }
	50%{ box-shadow:0 0 0 10px rgba(0,158,97,0); }
}
.cartabin-final-amount__value{
	font-size:25px;
	font-weight:800;
	color:var(--ap-navy);
	font-variant-numeric:tabular-nums;
}
.cartabin-final-amount__unit{
	font-size:14px;
	font-weight:600;
	color:#6b7785;
}
.cartabin-card__copy--light{
	margin-inline-start:6px;
	background:#fff;
	border:1px solid #c9ecdb;
	color:var(--ap-green-dark);
}
.cartabin-card__copy--light:hover{ background:#c9ecdb; }
.cartabin-card__copy--light.is-copied{ background:var(--ap-green); color:#fff; border-color:var(--ap-green); }

.cartabin-total-copy{
	margin-inline-start:8px;
	background:var(--ap-green-tint);
	border:1px solid #c9ecdb;
	color:var(--ap-green-dark);
	font-size:11px;
	font-weight:600;
	padding:3px 10px;
	border-radius:7px;
	cursor:pointer;
	vertical-align:middle;
}
.cartabin-total-copy:hover{ background:#c9ecdb; }
.cartabin-total-copy.is-copied{ background:var(--ap-green); color:#fff; border-color:var(--ap-green); }

.cartabin-box__note{
	background:var(--ap-green-tint);
	border:1px solid #c9ecdb;
	color:var(--ap-green-dark);
	font-size:12.5px;
	font-weight:600;
	border-radius:12px;
	padding:12px 16px;
	margin-bottom:16px;
}

.cartabin-timer{
	display:flex; align-items:center; justify-content:space-between;
	padding:0 4px 20px; font-size:12.5px; color:#6b7785;
}
.cartabin-timer__value{ font-weight:700; color:var(--ap-navy); font-variant-numeric:tabular-nums; }

.cartabin-steps{
	margin:0 0 22px; padding-inline-start:20px;
	font-size:13px; color:#374151; line-height:1.9;
}

.cartabin-field{ display:block; margin-bottom:14px; font-size:13px; font-weight:600; }
.cartabin-field span{ display:block; margin-bottom:6px; }
.cartabin-field input,
.cartabin-field textarea{
	width:100%; padding:10px 12px; border:1px solid var(--ap-border);
	border-radius:10px; font-weight:400; box-sizing:border-box;
}
.cartabin-field input:focus,
.cartabin-field textarea:focus{
	outline:none; border-color:var(--ap-green); box-shadow:0 0 0 3px var(--ap-green-tint);
}
.cartabin-field__hint{
	margin-top:6px; font-size:11px; font-weight:400; color:#8b95a1; display:block;
}
.cartabin-required{ color:#c0392b; font-style:normal; }

.cartabin-upload-zone{
	position:relative;
	margin:0 -6px 10px;
	min-height:150px;
	border:2px dashed var(--ap-border);
	border-radius:16px;
	background:#f8fafc;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	transition:border-color .15s, background .15s;
}
.cartabin-upload-zone:hover{
	border-color:var(--ap-green);
	background:var(--ap-green-tint);
}
.cartabin-upload-zone__input{
	position:absolute; inset:0; opacity:0; pointer-events:none; width:1px; height:1px;
}
.cartabin-upload-zone__idle,
.cartabin-upload-zone__done{
	display:flex; flex-direction:column; align-items:center; gap:5px;
	padding:20px; text-align:center;
}
.cartabin-upload-zone__emoji{ font-size:36px; margin-bottom:2px; }
.cartabin-upload-zone__title{ font-size:13.5px; font-weight:700; color:var(--ap-navy); }
.cartabin-upload-zone__subtitle{ font-size:11.5px; color:#8b95a1; margin-bottom:6px; }
.cartabin-upload-zone__btn{
	display:inline-block;
	background:var(--ap-navy);
	color:#fff;
	font-size:12px;
	font-weight:600;
	padding:8px 18px;
	border-radius:9px;
}
.cartabin-upload-zone__done .cartabin-upload-zone__title{ color:var(--ap-green-dark); }

.cartabin-field-group-label{
	display:block; font-size:13px; font-weight:700; color:var(--ap-navy); margin-bottom:12px;
}
.cartabin-field-group-label em{
	font-style:normal; font-weight:400; color:#8b95a1; font-size:11.5px;
}

.cartabin-validation-message{
	margin:0 0 12px; font-size:12.5px; color:#c0392b; display:none;
}
.cartabin-validation-message.is-visible{ display:block; }

.cartabin-submit-btn,
#place_order.cartabin-disabled{
	opacity:.55; cursor:not-allowed;
}

.cartabin-state{
	display:flex; flex-direction:column; align-items:center; text-align:center;
	gap:10px; padding:24px 10px;
}
.cartabin-state__icon{ font-size:30px; }
.cartabin-state--verified .cartabin-state__icon{ color:var(--ap-green); }
.cartabin-state--pending .cartabin-state__icon{ color:#a86c00; }
.cartabin-state p{ margin:0; font-size:14px; color:#374151; }

/* ---------- Item 7: rectangular card-selector tabs ---------- */
.cartabin-card-tabs{
	display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px;
}
.cartabin-card-tab{
	flex:1 1 auto; min-width:110px;
	background:#F7F8FB; border:1.5px solid var(--ap-border); border-radius:10px;
	padding:10px 14px; font-size:12.5px; font-weight:700; color:#4b5563;
	cursor:pointer; transition:background .15s, border-color .15s, color .15s;
	font-family:inherit;
}
.cartabin-card-tab:hover{ background:#EEF1F5; }
.cartabin-card-tab.is-active{
	background:var(--ap-navy); border-color:var(--ap-navy); color:#fff;
}

/* Each card panel gets a slightly different gradient angle/tint on
   selection, purely so switching between cards *feels* like something
   changed, beyond just the numbers themselves. */
.cartabin-card{ transition:background .25s ease; }
.cartabin-card-panels .cartabin-card:nth-of-type(1).is-active{
	background:linear-gradient(135deg, var(--ap-navy) 0%, var(--ap-navy-light) 100%);
}
.cartabin-card-panels .cartabin-card:nth-of-type(2).is-active{
	background:linear-gradient(150deg, var(--ap-navy) 0%, #0d3f7a 100%);
}
.cartabin-card-panels .cartabin-card:nth-of-type(3).is-active{
	background:linear-gradient(120deg, var(--ap-navy) 10%, #1a2f63 100%);
}
.cartabin-card-panels .cartabin-card:nth-of-type(4).is-active{
	background:linear-gradient(160deg, var(--ap-navy) 0%, #103a5c 100%);
}
.cartabin-card-panels .cartabin-card:nth-of-type(n+5).is-active{
	background:linear-gradient(140deg, var(--ap-navy) 0%, var(--ap-navy-light) 100%);
}

/* ---------- Item 8: mobile responsiveness ---------- */
@media (max-width: 600px){
	/* Most WooCommerce themes put their own padding on the payment method's
	   expanded content wrapper (.payment_box), which then stacks with
	   .cartabin-box's own padding below it - on a narrow screen this can
	   leave very little real width for the card number/sheba to lay out
	   in. Neutralizing the outer padding here and letting .cartabin-box
	   manage its own (smaller, mobile-appropriate) spacing fixes that
	   without touching the theme itself. */
	.payment_box.payment_method_cartabin{
		padding:0 !important;
		width:100% !important;
	}
	.cartabin-box{
		padding:12px;
		width:100%;
		border-radius:14px;
	}
	.cartabin-card{ padding:18px 16px 14px; }
	.cartabin-card__number span{ font-size:16px; letter-spacing:.5px; }
	.cartabin-card__row{ gap:8px; }
	.cartabin-card__copy{ margin-inline-start:0; }
	.cartabin-card-tab{ min-width:90px; font-size:11.5px; padding:9px 10px; }
	.cartabin-final-amount{ flex-wrap:wrap; }
}