/* ALMAAS side cart */
.almaas-sc-toggle {
	position: relative; display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; padding: 0; border: 0; background: none; color: #000; cursor: pointer;
}
.almaas-sc-count {
	position: absolute; top: 4px; inset-inline-end: 2px; min-width: 18px; height: 18px; padding: 0 4px;
	border-radius: 9px; background: #e0b9ad; color: #000; font-size: 11px; line-height: 18px; text-align: center;
}
.almaas-sc-count[data-count="0"] { display: none; }

.almaas-sc-overlay {
	position: fixed; inset: 0; z-index: 99998; background: rgba(0, 0, 0, .35);
	opacity: 0; transition: opacity .25s;
}
.almaas-sc {
	position: fixed; top: 0; bottom: 0; left: 0; z-index: 99999; width: min(420px, 92vw);
	display: flex; flex-direction: column; background: #fff; direction: rtl;
	transform: translateX(-100%); transition: transform .25s ease; box-shadow: 0 0 40px rgba(0,0,0,.12);
}
body.almaas-sc-open .almaas-sc { transform: none; }
body.almaas-sc-open .almaas-sc-overlay { opacity: 1; }
body.almaas-sc-open { overflow: hidden; }

.almaas-sc__head { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid #eee; }
.almaas-sc__title { font-size: 16px; letter-spacing: .08em; }
.almaas-sc .almaas-sc__close,
.almaas-sc .almaas-sc__close:hover,
.almaas-sc .almaas-sc__close:focus {
	width: 44px; height: 44px; padding: 0; border: 0 !important; border-radius: 0; background: none !important;
	box-shadow: none; font-size: 28px; line-height: 1; cursor: pointer; color: #000 !important;
}
/* The drawer opens on add, so WooCommerce's extra "view cart" link is not needed. */
a.added_to_cart.wc-forward { display: none !important; }
.almaas-sc__body { flex: 1; display: flex; flex-direction: column; overflow-y: auto; padding: 0 18px 18px; }
.almaas-sc__empty { margin: 32px 0 16px; text-align: center; }

.almaas-sc__items { list-style: none; margin: 8px 0 0; padding: 0; }
.almaas-sc__item, .almaas-sc__rec-row { display: flex; gap: 12px; padding: 14px 0; border-bottom: 1px solid #f0ebe9; }
.almaas-sc__img img { width: 72px; height: 72px; object-fit: cover; display: block; }
.almaas-sc__info { flex: 1; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.almaas-sc__name { color: #000; font-size: 14px; text-decoration: none; }
.almaas-sc__price { font-size: 14px; }

.almaas-sc .almaas-qty { display: inline-flex; align-items: center; gap: 6px; }
.almaas-sc .almaas-qty__btn { width: 30px; height: 30px; border: 1px solid #e6e0dd; border-radius: 50%; background: #fff; color: #000; cursor: pointer; padding: 0; }
.almaas-sc .almaas-qty__remove { border: 0; background: none; color: #5c5552; font-size: 12px; text-decoration: underline; cursor: pointer; margin-inline-start: 6px; }

.almaas-sc__rec { margin-top: 16px; padding: 12px; background: #fafafa; border: 1px solid #ece6e3; }
.almaas-sc__rec-title { display: block; font-size: 13px; letter-spacing: .06em; margin-bottom: 4px; }
.almaas-sc__rec-row { border-bottom: 0; padding: 8px 0 0; align-items: center; }
.almaas-sc__add { min-height: 40px; padding: 0 16px; border: 1px solid #000; background: #fff; color: #000; cursor: pointer; }

.almaas-sc__foot { margin-top: auto; padding-top: 16px; display: flex; flex-direction: column; gap: 10px; }
.almaas-sc__subtotal { display: flex; justify-content: space-between; font-size: 15px; }
.almaas-sc__btn {
	display: flex; align-items: center; justify-content: center; min-height: 52px;
	background: #000; color: #fff; border: 1px solid #000; text-decoration: none; font-size: 16px; cursor: pointer;
}
.almaas-sc__btn--ghost { background: #fff; color: #000; }

.almaas-sc .almaas-fs { padding: 14px 0 6px; }
.almaas-sc .almaas-fs__text { font-size: 14px; margin-bottom: 6px; }
.almaas-sc .almaas-fs__track { height: 4px; background: #ece6e3; border-radius: 2px; overflow: hidden; }
.almaas-sc .almaas-fs__track span { display: block; height: 100%; background: #000; transition: width .4s; }
.almaas-sc .almaas-fs.is-done .almaas-fs__track span { background: #b8a59e; }
.almaas-sc.almaas-busy .almaas-sc__body { opacity: .55; pointer-events: none; }
.almaas-sc-error { flex-basis: 100%; margin: 8px 0 0; font-size: 14px; color: #9b1c1c; }

@media (prefers-reduced-motion: reduce) {
	.almaas-sc, .almaas-sc-overlay { transition: none; }
}