/* =========================
   TOAST CONTAINER
========================= */

#mytheme-toast-container{

	position:fixed;

	right:20px;
	bottom:20px;

	display:flex;
	flex-direction:column;

	align-items:flex-end;

	gap:14px;

	z-index:999999;

	pointer-events:none;
}


/* =========================
   TOAST CARD
========================= */

.mytheme-toast{

	position:relative;

	display:flex;
	align-items:flex-start;

	gap:14px;

	width:340px;
	max-width:90vw;

	padding:18px;

	border-radius:18px;

	background:#ffffff;

	border:1px solid rgba(15,23,42,.06);

	box-shadow:
		0 10px 30px rgba(15,23,42,.08),
		0 4px 10px rgba(15,23,42,.04);

	font-family:"Yekan-Regular";

	animation:toastIn .25s ease;

	pointer-events:auto;

	overflow:hidden;
}


/* =========================
   TOAST TYPES
========================= */

.mytheme-toast-success{

	border-right:4px solid #16a34a;
}

.mytheme-toast-error{

	border-right:4px solid #dc2626;
}

.mytheme-toast-info{

	border-right:4px solid #2563eb;
}

.mytheme-toast-warning{

	border-right:4px solid #f59e0b;
}


/* =========================
   ICON
========================= */

.toast-icon{

	display:flex;
	align-items:center;
	justify-content:center;

	width:42px;
	height:42px;

	flex-shrink:0;

	border-radius:12px;

	font-size:18px;
	font-weight:700;
}


/* success */

.mytheme-toast-success .toast-icon{

	background:rgba(22,163,74,.1);
	color:#16a34a;
}


/* error */

.mytheme-toast-error .toast-icon{

	background:rgba(220,38,38,.1);
	color:#dc2626;
}


/* info */

.mytheme-toast-info .toast-icon{

	background:rgba(37,99,235,.1);
	color:#2563eb;
}


/* warning */

.mytheme-toast-warning .toast-icon{

	background:rgba(245,158,11,.1);
	color:#f59e0b;
}


/* =========================
   CONTENT
========================= */

.toast-content{

	flex:1;
	min-width:0;
}


/* =========================
   TITLE
========================= */

.toast-title{

	font-size:.95rem;
	font-weight:700;

	color:#0f172a;

	margin-bottom:4px;
}


/* =========================
   MESSAGE
========================= */

.toast-message{

	font-size:.88rem;
	line-height:1.9;

	color:#475569;

	word-break:break-word;
}


/* =========================
   CLOSE BUTTON
========================= */

.toast-close{

	display:flex;
	align-items:center;
	justify-content:center;

	width:30px;
	height:30px;

	padding:0;

	border:none;
	border-radius:8px;

	background:transparent;

	color:#94a3b8;

	font-size:18px;

	cursor:pointer;

	transition:.2s ease;

	flex-shrink:0;
}

.toast-close:hover{

	background:#f1f5f9;

	color:#0f172a;
}


/* =========================
   SHOW ANIMATION
========================= */

@keyframes toastIn{

	from{

		opacity:0;

		transform:
			translateY(14px)
			scale(.96);

	}

	to{

		opacity:1;

		transform:
			translateY(0)
			scale(1);

	}
}


/* =========================
   HIDE ANIMATION
========================= */

.mytheme-toast.hide{

	animation:toastOut .25s ease forwards;
}

@keyframes toastOut{

	to{

		opacity:0;

		transform:
			translateY(10px)
			scale(.96);

	}
}


/* =========================
   LOADING BUTTON
========================= */

.mytheme-add-to-cart.loading{

	opacity:.7;

	cursor:not-allowed;

	pointer-events:none;
}


/* =========================
   MOBILE
========================= */

@media(max-width:480px){

	#mytheme-toast-container{

		right:12px;
		left:12px;

		bottom:12px;

		align-items:stretch;
	}

	.mytheme-toast{

		width:100%;
		max-width:100%;
	}

}
