.mlo-wrap,
.mlo-wrap *{
	box-sizing:border-box;
}

.mlo-wrap{
	font-family:inherit;
	direction:rtl;
	margin:12px 0 18px;
	color:var(--mlo-text);
}

.mlo-compact-box{
	border:1px solid var(--mlo-border);
	background:var(--mlo-surface);
	border-radius:14px;
	padding:12px;
}

.mlo-compact-title{
	display:flex;
	align-items:center;
	gap:6px;
	margin-bottom:10px;
}

.mlo-compact-title strong{
	font-size:13px;
	line-height:1.6;
	color:var(--mlo-text);
}

.mlo-required-dot{
	font-size:7px;
	color:var(--mlo-danger);
}

.mlo-inline-actions{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:9px;
}

.mlo-open-button,
.mlo-none-inline{
	width:100%;
	min-height:52px;
	border:1px solid var(--mlo-border)!important;
	border-radius:11px!important;
	background:var(--mlo-surface)!important;
	color:var(--mlo-text)!important;
	padding:8px 10px!important;
	font:inherit!important;
	text-align:right!important;
	box-shadow:none!important;
	text-shadow:none!important;
	cursor:pointer;
	transition:.18s ease;
}

.mlo-open-button{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	background:var(--mlo-primary)!important;
	border-color:var(--mlo-primary)!important;
	color:var(--mlo-surface)!important;
	font-weight:800!important;
}

.mlo-open-button:hover{
	background:var(--mlo-primary-hover)!important;
	border-color:var(--mlo-primary-hover)!important;
	color:var(--mlo-surface)!important;
}

.mlo-open-button.is-selected{
	box-shadow:0 0 0 2px var(--mlo-selected-bg)!important;
}

.mlo-action-icon{
	font-size:18px;
	line-height:1;
	opacity:.9;
}

.mlo-none-inline{
	display:grid;
	grid-template-columns:20px minmax(0,1fr);
	align-items:center;
	gap:9px;
}

.mlo-none-inline:hover,
.mlo-none-inline.is-selected{
	border-color:var(--mlo-selected-border)!important;
	background:var(--mlo-selected-bg)!important;
}

.mlo-inline-radio{
	width:18px;
	height:18px;
	border-radius:50%;
	border:2px solid var(--mlo-border);
	background:var(--mlo-surface);
	position:relative;
	transition:.18s ease;
}

.mlo-none-inline.is-selected .mlo-inline-radio{
	border-color:var(--mlo-primary);
}

.mlo-none-inline.is-selected .mlo-inline-radio:after{
	content:"";
	position:absolute;
	inset:3px;
	border-radius:50%;
	background:var(--mlo-primary);
}

.mlo-none-copy{
	display:flex;
	flex-direction:column;
	gap:2px;
	min-width:0;
}

.mlo-none-copy strong{
	font-size:12px;
	line-height:1.5;
	color:var(--mlo-text);
}

.mlo-none-copy small{
	font-size:10px;
	line-height:1.5;
	color:var(--mlo-muted);
}

.mlo-selected-summary{
	display:grid;
	grid-template-columns:46px minmax(0,1fr) auto;
	align-items:center;
	gap:10px;
	margin-top:10px;
	padding-top:10px;
	border-top:1px solid var(--mlo-border);
}

.mlo-selected-image{
	width:46px;
	height:46px;
	border-radius:10px;
	overflow:hidden;
	display:grid;
	place-items:center;
	background:var(--mlo-surface-alt);
}

.mlo-selected-image img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}

.mlo-summary-check{
	width:24px;
	height:24px;
	border-radius:50%;
	display:grid;
	place-items:center;
	background:var(--mlo-selected-bg);
	color:var(--mlo-success);
	font-size:13px;
	font-weight:900;
}

.mlo-selected-copy{
	display:flex;
	flex-direction:column;
	gap:2px;
	min-width:0;
}

.mlo-selected-copy small{
	font-size:10px;
	color:var(--mlo-muted);
}

.mlo-selected-copy strong{
	font-size:12px;
	line-height:1.5;
	color:var(--mlo-text);
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

.mlo-selected-detail{
	font-size:10px;
	line-height:1.5;
	color:var(--mlo-success);
}

.mlo-edit-button,
.mlo-cancel-button{
	border:1px solid var(--mlo-border)!important;
	background:var(--mlo-surface)!important;
	color:var(--mlo-text)!important;
	border-radius:10px!important;
	padding:7px 12px!important;
	min-height:38px;
	font:inherit!important;
	font-size:11px!important;
	font-weight:700!important;
	cursor:pointer;
	box-shadow:none!important;
	text-shadow:none!important;
}

.mlo-inline-error,
.mlo-modal-error{
	margin-top:10px;
	padding:9px 11px;
	border-radius:9px;
	border:1px solid var(--mlo-danger);
	background:var(--mlo-surface-alt);
	color:var(--mlo-danger);
	font-size:11px;
	font-weight:600;
}

.mlo-modal{
	position:fixed;
	inset:0;
	z-index:999999;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:18px;
	visibility:hidden;
	opacity:0;
	pointer-events:none;
	transition:.2s ease;
}

.mlo-modal.is-open{
	visibility:visible;
	opacity:1;
	pointer-events:auto;
}

.mlo-overlay{
	position:absolute;
	inset:0;
	background:var(--mlo-overlay);
	opacity:var(--mlo-overlay-opacity);
}

.mlo-panel{
	position:relative;
	z-index:2;
	width:min(700px,100%);
	max-height:min(84vh,760px);
	display:flex;
	flex-direction:column;
	background:var(--mlo-surface);
	border:1px solid var(--mlo-border);
	border-radius:18px;
	overflow:hidden;
	box-shadow:0 20px 60px color-mix(in srgb, var(--mlo-shadow) 22%, transparent);
	transform:translateY(10px) scale(.99);
	transition:.2s ease;
}

.mlo-modal.is-open .mlo-panel{
	transform:translateY(0) scale(1);
}

.mlo-panel-head{
	flex:0 0 auto;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	padding:13px 15px;
	border-bottom:1px solid var(--mlo-border);
	background:var(--mlo-surface);
}

.mlo-panel-head>div{
	display:flex;
	flex-direction:column;
	gap:2px;
	min-width:0;
}

.mlo-panel-head strong{
	font-size:14px;
	line-height:1.5;
	color:var(--mlo-text);
}

.mlo-panel-head small{
	font-size:10px;
	color:var(--mlo-muted);
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

.mlo-close{
	width:34px;
	height:34px;
	border:1px solid var(--mlo-border)!important;
	border-radius:9px!important;
	background:var(--mlo-surface-alt)!important;
	color:var(--mlo-text)!important;
	font-size:20px!important;
	line-height:1!important;
	display:grid;
	place-items:center;
	padding:0!important;
	cursor:pointer;
	box-shadow:none!important;
}

.mlo-panel-body{
	flex:1 1 auto;
	overflow:auto;
	padding:14px;
	background:var(--mlo-surface);
}

.mlo-choice-section{
	border:1px solid var(--mlo-border);
	border-radius:14px;
	padding:12px;
}

.mlo-type-section{
	background:var(--mlo-surface-alt);
}

.mlo-color-section{
	margin-top:12px;
	background:var(--mlo-surface);
	border-style:dashed;
	border-width:1px;
}

.mlo-step-head{
	display:flex;
	align-items:center;
	gap:9px;
	margin-bottom:11px;
}

.mlo-step-index{
	flex:0 0 auto;
	width:28px;
	height:28px;
	border-radius:9px;
	display:grid;
	place-items:center;
	background:var(--mlo-primary);
	color:var(--mlo-surface);
	font-size:11px;
	font-weight:800;
}

.mlo-color-section .mlo-step-index{
	background:var(--mlo-selected-bg);
	color:var(--mlo-primary);
	border:1px solid var(--mlo-selected-border);
}

.mlo-step-head>div{
	display:flex;
	flex-direction:column;
	gap:1px;
}

.mlo-step-head strong{
	font-size:12px;
	line-height:1.5;
	color:var(--mlo-text);
}

.mlo-step-head small{
	font-size:9px;
	line-height:1.5;
	color:var(--mlo-muted);
}

.mlo-type-grid{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:8px;
}

.mlo-type-card{
	position:relative;
	display:grid;
	grid-template-columns:44px minmax(0,1fr) 18px;
	align-items:center;
	gap:8px;
	width:100%;
	min-height:62px;
	padding:7px!important;
	border:1px solid var(--mlo-border)!important;
	border-radius:11px!important;
	background:var(--mlo-surface)!important;
	color:var(--mlo-text)!important;
	font:inherit!important;
	text-align:right!important;
	cursor:pointer;
	box-shadow:none!important;
	text-shadow:none!important;
	transition:.18s ease;
}

.mlo-type-card:hover,
.mlo-type-card.is-selected{
	border-color:var(--mlo-selected-border)!important;
	background:var(--mlo-selected-bg)!important;
}

.mlo-type-thumb{
	width:44px;
	height:44px;
	border-radius:9px;
	overflow:hidden;
	display:grid;
	place-items:center;
	background:var(--mlo-surface-alt);
}

.mlo-type-thumb img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}

.mlo-placeholder-shape{
	width:24px;
	height:12px;
	border-radius:999px;
	background:var(--mlo-border);
}

.mlo-type-copy{
	min-width:0;
}

.mlo-type-copy strong{
	display:block;
	font-size:11px;
	line-height:1.5;
	color:var(--mlo-text);
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

.mlo-checkmark{
	width:18px;
	height:18px;
	border-radius:50%;
	display:grid;
	place-items:center;
	background:var(--mlo-primary);
	color:var(--mlo-surface);
	font-size:10px;
	font-weight:900;
	opacity:0;
	transform:scale(.8);
	transition:.18s ease;
}

.is-selected>.mlo-checkmark{
	opacity:1;
	transform:scale(1);
}

.mlo-color-grid{
	display:grid;
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:8px;
}

.mlo-color-card{
	position:relative;
	display:grid;
	grid-template-columns:38px minmax(0,1fr) 18px;
	align-items:center;
	gap:8px;
	width:100%;
	min-height:54px;
	padding:7px!important;
	border:1px solid var(--mlo-border)!important;
	border-radius:11px!important;
	background:var(--mlo-surface)!important;
	color:var(--mlo-text)!important;
	font:inherit!important;
	text-align:right!important;
	cursor:pointer;
	box-shadow:none!important;
	text-shadow:none!important;
	transition:.18s ease;
}

.mlo-color-card:hover,
.mlo-color-card.is-selected{
	border-color:var(--mlo-selected-border)!important;
	background:var(--mlo-selected-bg)!important;
}

.mlo-swatch{
	width:38px;
	height:38px;
	border-radius:50%;
	overflow:hidden;
	display:block;
	background:var(--mlo-swatch);
	border:1px solid var(--mlo-border);
}

.mlo-swatch img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}

.mlo-color-copy{
	min-width:0;
}

.mlo-color-copy strong{
	display:block;
	font-size:10px;
	line-height:1.5;
	color:var(--mlo-text);
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

.mlo-no-colors{
	padding:10px;
	border:1px dashed var(--mlo-border);
	border-radius:10px;
	color:var(--mlo-muted);
	font-size:11px;
	text-align:center;
}

.mlo-preview-card{
	display:block;
	margin-top:12px;
	padding:10px;
	border:1px solid var(--mlo-border);
	border-radius:14px;
	background:var(--mlo-surface);
}

.mlo-preview-large{
	margin-top:12px;
	margin-bottom:12px;
}

.mlo-preview-image{
	width:100%;
	aspect-ratio:16 / 9;
	max-height:340px;
	border-radius:12px;
	overflow:hidden;
	background:var(--mlo-surface-alt);
	border:1px solid var(--mlo-border);
}

.mlo-preview-image img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}

.mlo-preview-copy{
	display:flex;
	flex-direction:column;
	gap:3px;
	padding:9px 2px 1px;
	min-width:0;
}

.mlo-preview-copy small{
	font-size:9px;
	color:var(--mlo-muted);
}

.mlo-preview-copy strong{
	font-size:13px;
	line-height:1.5;
	color:var(--mlo-text);
}

.mlo-preview-copy span{
	font-size:10px;
	line-height:1.5;
	color:var(--mlo-muted);
}

.mlo-panel-footer{
	flex:0 0 auto;
	display:grid;
	grid-template-columns:1fr 1.35fr;
	gap:8px;
	padding:11px 14px;
	border-top:1px solid var(--mlo-border);
	background:var(--mlo-surface);
}

.mlo-confirm-button{
	border:0!important;
	background:var(--mlo-primary)!important;
	color:var(--mlo-surface)!important;
	border-radius:10px!important;
	min-height:40px;
	padding:8px 14px!important;
	font:inherit!important;
	font-size:12px!important;
	font-weight:800!important;
	cursor:pointer;
	box-shadow:none!important;
	text-shadow:none!important;
}

.mlo-confirm-button:hover{
	background:var(--mlo-primary-hover)!important;
	color:var(--mlo-surface)!important;
}

body.mlo-modal-open{
	overflow:hidden;
}

.mlo-cart-leather-thumb{
	display:block;
	width:34px;
	height:34px;
	border-radius:8px;
	overflow:hidden;
	margin-top:5px;
	border:1px solid var(--mlo-border);
}

.mlo-cart-leather-thumb img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}

@media (max-width:767px){
	.mlo-inline-actions{
		grid-template-columns:1fr;
	}

	.mlo-selected-summary{
		grid-template-columns:44px minmax(0,1fr);
	}

	.mlo-edit-button{
		grid-column:1/-1;
		width:100%;
	}

	.mlo-modal{
		align-items:flex-end;
		padding:0;
	}

	.mlo-panel{
		width:100%;
		max-height:89vh;
		border-radius:18px 18px 0 0;
		border-bottom:0;
		transform:translateY(24px);
	}

	.mlo-modal.is-open .mlo-panel{
		transform:translateY(0);
	}

	.mlo-panel-head{
		padding:12px 13px;
	}

	.mlo-panel-body{
		padding:12px;
	}

	.mlo-type-grid{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}

	.mlo-color-grid{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}

	.mlo-panel-footer{
		position:sticky;
		bottom:0;
		padding:10px 12px calc(10px + env(safe-area-inset-bottom));
	}

	.mlo-cancel-button,
	.mlo-confirm-button{
		min-height:44px;
	}
}

@media (max-width:420px){
	.mlo-type-grid{
		grid-template-columns:1fr;
	}

	.mlo-color-grid{
		grid-template-columns:1fr 1fr;
	}
}


/* Direct integration with Matson custom variable-product buybox */
.matson-product-buybox.mlo-buybox-without-leather .matson-range-box{
	border-color:var(--mlo-selected-border);
	background:var(--mlo-selected-bg);
}

.matson-product-buybox .matson-variation-row.mlo-without-leather-price{
	border-color:color-mix(in srgb, var(--mlo-selected-border) 35%, transparent);
	background:color-mix(in srgb, var(--mlo-selected-bg) 55%, #fff);
}

.matson-product-buybox .matson-variation-row.mlo-without-leather-price .matson-variation-price strong::after{
	content:"بدون چرم";
	display:inline-flex;
	margin-right:7px;
	padding:2px 6px;
	border-radius:999px;
	background:var(--mlo-selected-bg);
	color:var(--mlo-primary);
	font-size:9px;
	font-weight:700;
	vertical-align:middle;
}


/* v1.2.2: حالت انتخاب/لغو گزینه بدون چرم */
.mlo-none-inline{
	user-select:none;
}

.mlo-none-inline.is-selected{
	box-shadow:0 0 0 2px color-mix(in srgb, var(--mlo-selected-border) 14%, transparent)!important;
}

.mlo-none-inline.is-selected .mlo-none-copy strong::after{
	content:"انتخاب شده";
	display:inline-flex;
	margin-right:6px;
	padding:1px 6px;
	border-radius:999px;
	background:var(--mlo-primary);
	color:var(--mlo-surface);
	font-size:8px;
	font-weight:700;
	vertical-align:middle;
}


@media (max-width:767px){
	.mlo-preview-large{
		margin-top:10px;
		margin-bottom:10px;
	}

	.mlo-preview-image{
		aspect-ratio:4 / 3;
		max-height:320px;
		border-radius:11px;
	}
}