/* Malaka Last Order Popup - frontend */
.mlo-popup{
	position:fixed;
	z-index:99990;
	max-width:330px;
	min-width:270px;
	background:#fff;
	border-radius:14px;
	box-shadow:0 12px 40px rgba(20,20,40,.18);
	padding:12px 14px;
	display:flex;
	align-items:center;
	gap:12px;
	font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
	opacity:0;
	transform:translateY(20px);
	transition:opacity .4s ease,transform .4s ease;
	pointer-events:auto;
}
.mlo-popup.mlo-show{opacity:1;transform:translateY(0)}

/* Posisi */
.mlo-bottom-left{left:20px;bottom:20px}
.mlo-bottom-right{right:20px;bottom:20px}
.mlo-top-left{left:20px;top:20px;transform:translateY(-20px)}
.mlo-top-right{right:20px;top:20px;transform:translateY(-20px)}
.mlo-top-left.mlo-show,.mlo-top-right.mlo-show{transform:translateY(0)}

/* Foto */
.mlo-photo{
	width:48px;height:48px;border-radius:50%;
	object-fit:cover;flex:none;background:#eef0f5;
}
.mlo-initial{
	width:48px;height:48px;border-radius:50%;flex:none;
	display:flex;align-items:center;justify-content:center;
	background:linear-gradient(135deg,#5C3DAE,#2C7BE5);
	color:#fff;font-weight:700;font-size:18px;
}

/* Isi */
.mlo-body{flex:1;min-width:0}
.mlo-name{font-weight:700;font-size:14px;color:#1e1b2e;line-height:1.3}
.mlo-name b{color:#5C3DAE}
.mlo-sub{font-size:12.5px;color:#6b6680;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mlo-stars{color:#FFC542;font-size:13px;letter-spacing:1px;margin-top:2px;line-height:1}
.mlo-time{font-size:11px;color:#9a94ab;margin-top:3px;display:flex;align-items:center;gap:4px}
.mlo-time::before{content:"";width:6px;height:6px;border-radius:50%;background:#1FAE7E;display:inline-block}

/* Tombol tutup */
.mlo-close{
	position:absolute;top:6px;right:8px;
	background:none;border:0;cursor:pointer;
	color:#b6b0c6;font-size:16px;line-height:1;padding:2px;
}
.mlo-close:hover{color:#6b6680}

/* Mobile */
@media(max-width:560px){
	.mlo-popup{
		max-width:calc(100% - 24px);
		min-width:0;
		left:12px!important;right:12px!important;
		bottom:12px;
	}
	.mlo-top-left,.mlo-top-right{top:12px;bottom:auto}
}

@media(prefers-reduced-motion:reduce){
	.mlo-popup{transition:opacity .2s}
}
