/* Afico — notifikasi pembelian, gaya C (pil ringkas). --afb-s = skala saiz (1 = 100%) */
.afb-root{
	--afb-accent:#16a34a;--afb-counter:#f97316;--afb-bg:#fff;--afb-text:#0f172a;--afb-muted:#94a3b8;
	--afb-s:1;--afb-z:99990;--afb-off-d:20px;--afb-off-m:12px;
	position:fixed;z-index:var(--afb-z);pointer-events:none;
	font-family:inherit;line-height:1.35;
}
.afb-root *{box-sizing:border-box}
.afb-root.afb-bl{left:var(--afb-off-d);bottom:var(--afb-off-d)}
.afb-root.afb-br{right:var(--afb-off-d);bottom:var(--afb-off-d)}
.afb-root.afb-mt{left:var(--afb-off-m);right:var(--afb-off-m);top:var(--afb-off-m)}
.afb-root.afb-mb{left:var(--afb-off-m);right:var(--afb-off-m);bottom:calc(var(--afb-off-m) + env(safe-area-inset-bottom,0px))}
body.admin-bar .afb-root.afb-mt{top:calc(var(--afb-off-m) + 46px)}

.afb-toast{
	display:flex;align-items:center;gap:calc(12px * var(--afb-s));
	max-width:calc(440px * var(--afb-s));
	padding:calc(8px * var(--afb-s)) calc(12px * var(--afb-s)) calc(8px * var(--afb-s)) calc(8px * var(--afb-s));
	background:var(--afb-bg);color:var(--afb-text);
	border:1px solid rgba(15,23,42,.08);border-radius:999px;
	box-shadow:0 12px 30px -8px rgba(15,23,42,.32);
	font-size:calc(15px * var(--afb-s));text-decoration:none!important;
	opacity:0;pointer-events:none;
	transition:opacity .35s ease,transform .45s cubic-bezier(.2,.9,.3,1.2);
}
.afb-mt .afb-toast,.afb-mb .afb-toast{max-width:none;border-radius:calc(28px * var(--afb-s))}
.afb-anim-slide.afb-bl .afb-toast,.afb-anim-slide.afb-br .afb-toast,.afb-anim-slide.afb-mb .afb-toast{transform:translateY(16px)}
.afb-anim-slide.afb-mt .afb-toast{transform:translateY(-16px)}
.afb-toast.afb-show{opacity:1;pointer-events:auto;transform:none!important}
a.afb-toast{cursor:pointer}
a.afb-toast:hover{box-shadow:0 14px 34px -8px rgba(15,23,42,.40)}

.afb-av{
	flex:none;width:calc(42px * var(--afb-s));height:calc(42px * var(--afb-s));border-radius:50%;
	display:grid;place-items:center;overflow:hidden;
	background:var(--afb-accent);color:#fff;font-weight:800;font-size:calc(17px * var(--afb-s));
}
.afb-av img{width:100%;height:100%;object-fit:cover;display:block}
.afb-av svg{width:calc(19px * var(--afb-s));height:calc(19px * var(--afb-s))}
.afb-av.afb-av-count{background:var(--afb-counter)}

.afb-msg{flex:1;min-width:0;color:var(--afb-text)}
.afb-root.afb-bl .afb-msg,.afb-root.afb-br .afb-msg{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.afb-msg b{font-weight:800;color:var(--afb-text)}
.afb-msg .afb-prod{font-weight:700;color:var(--afb-accent)}
.afb-msg .afb-time{color:var(--afb-muted);font-weight:500}

.afb-x{
	flex:none;border:0;background:transparent;color:var(--afb-text);cursor:pointer;
	width:calc(26px * var(--afb-s));height:calc(26px * var(--afb-s));margin-left:2px;border-radius:50%;padding:0;
	font-size:calc(15px * var(--afb-s));line-height:calc(26px * var(--afb-s));text-align:center;opacity:.35;
}
.afb-x:hover,.afb-x:focus-visible{opacity:.8;background:rgba(15,23,42,.06)}

/* Kaunter dalam page: [afico_kaunter] */
.afb-count{
	--afb-counter:#f97316;
	display:inline-flex;align-items:center;gap:8px;
	padding:7px 12px;border-radius:10px;
	font-size:13px;font-weight:600;line-height:1.3;
	color:var(--afb-counter);
	background:#fff7ed;border:1px solid #fed7aa;
	background:color-mix(in srgb,var(--afb-counter) 9%,#fff);
	border-color:color-mix(in srgb,var(--afb-counter) 30%,#fff);
}
.afb-count[hidden]{display:none}
.afb-count b{font-weight:800}
.afb-count-dot{
	width:8px;height:8px;border-radius:50%;background:var(--afb-counter);
	animation:afb-pulse 1.6s infinite;
}
@keyframes afb-pulse{
	0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--afb-counter) 55%,transparent)}
	70%{box-shadow:0 0 0 8px transparent}
	100%{box-shadow:0 0 0 0 transparent}
}

@media (prefers-reduced-motion:reduce){
	.afb-toast{transition:opacity .2s ease;transform:none!important}
	.afb-count-dot{animation:none}
}
@media print{.afb-root{display:none!important}}
