/* ==========================================================================
   Міні-кошик у бічній панелі (Elementor Off Canvas)

   [mini_cart_items]  → .mini-cart-items
   [mini_cart_totals] → .mini-cart-totals
   Обидва блоки — фрагменти WooCommerce: їх вміст замінюється цілком,
   тому всі розміри задаються всередині, а не на батьківському елементі.
   Розтягування по висоті й порядок блоків — налаштуваннями контейнера Elementor.
   ========================================================================== */

.mini-cart-items{
	--mc-gap:12px;
	--mc-thumb:64px;
	--mc-qty-bg:var(--theme-light); /* плашка лічильника */
}

.mini-cart-items.is-loading,
.mini-cart-totals.is-loading{opacity:.5;pointer-events:none;transition:opacity .15s ease}

/* --- скид стилів Elementor ---
   Site Settings → Buttons у Elementor стилізує ВСІ <button> на сайті
   (у цьому проєкті — градієнтом і білим текстом), через що власні
   контроли міні-кошика перетворювались на темні плашки з невидимими
   іконками. Скидаємо явно: селектор із батьком + !important, бо правило
   кіта має вищу специфічність за одиночний клас. */
.mini-cart-items button.mini-cart__qty-btn,
.mini-cart-items button.mini-cart__clear{
	background:none !important;
	background-color:transparent !important;
	border:0 !important;
	box-shadow:none !important;
	text-shadow:none !important;
	color:var(--theme-text) !important;
	font-family:inherit;
	line-height:1;
}

/* --- шапка списку --- */
/* --- шапка списку --- */
.mini-cart__summary{
	display:flex;align-items:center;justify-content:space-between;gap:12px;
	margin-bottom:var(--mc-gap);
	font-size:13px;color:var(--theme-text);
}
.mini-cart__count{opacity:.6}
.mini-cart-items button.mini-cart__clear{
	padding:0 !important;
	cursor:pointer;
	font-size:13px;
	opacity:.6;
	text-decoration:underline;
	text-underline-offset:3px;
	transition:opacity .2s ease;
}
.mini-cart-items button.mini-cart__clear:hover{opacity:1}

/* --- список --- */
.mini-cart__list{
	display:flex;flex-direction:column;gap:var(--mc-gap);
	margin:0;padding:0;list-style:none;
}
.mini-cart__list li::before,
.mini-cart__list li::marker{display:none;content:none}

.mini-cart__item{
	display:grid;
	grid-template-columns:var(--mc-thumb) minmax(0,1fr);
	grid-template-areas:
		"thumb info"
		"thumb qty";
	align-items:center;
	gap:4px 12px;
	padding:6px;
	border-radius:var(--theme-radius-lg);
	background:var(--theme-light);
	box-shadow:var(--theme-shadow); /* той самий токен, що й у картці категорії */
}
.mini-cart__thumb{grid-area:thumb;align-self:start}
.mini-cart__thumb img{
	display:block;width:var(--mc-thumb);height:var(--mc-thumb);
	object-fit:cover;border-radius:var(--theme-radius);
}
.mini-cart__info{grid-area:info;display:flex;flex-direction:column;gap:6px;min-width:0}
.mini-cart__title{
	font-size:13px;line-height:1.3;color:var(--theme-text);text-decoration:none;
}
.mini-cart__title:hover{text-decoration:underline}
.mini-cart__price{font-size:15px;font-weight:600;color:var(--theme-text)}

/* --- лічильник кількості --- */
.mini-cart__qty{
	grid-area:qty;justify-self:end;
	display:inline-flex;align-items:center;gap:2px;
	padding:3px;border-radius:999px;
	background:var(--mc-qty-bg);
	border:1px solid rgba(0,0,0,.08);
}
.mini-cart-items button.mini-cart__qty-btn{
	box-sizing:border-box;
	width:30px;height:30px;padding:0 !important;
	display:inline-flex;align-items:center;justify-content:center;
	border-radius:50% !important;
	cursor:pointer;
	transition:background-color .2s ease,color .2s ease;
}
.mini-cart-items button.mini-cart__qty-btn:hover{background-color:var(--theme-surface-alt) !important}
.mini-cart-items button.mini-cart__qty-btn--dec[data-cart-action="remove"]:hover{color:var(--theme-accent) !important}
.mini-cart__qty-btn svg{width:18px;height:18px;display:block}
.mini-cart__qty-value{
	min-width:22px;text-align:center;
	font-size:14px;font-weight:600;color:var(--theme-text);
}

/* --- порожній кошик --- */
.mini-cart__empty{margin:0;padding:24px 0;text-align:center;color:var(--theme-text);opacity:.6}

/* --- підсумок --- */
.mini-cart-totals{
	--mc-totals-size:16px; /* один розмір на весь підсумок */
}
.mini-cart-totals.is-empty{display:none}

.mini-cart__totals-title{
	margin:0 0 12px;
	font-size:var(--mc-totals-size);
	font-weight:600;
	color:var(--theme-text);
}

.mini-cart__totals-rows{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.mini-cart__row{
	display:flex;align-items:baseline;justify-content:space-between;gap:12px;
	font-size:var(--mc-totals-size);
	color:var(--theme-text);
}
.mini-cart__row span:last-child{font-weight:600;white-space:nowrap}

/* Вигляд кнопки — з Site Settings → Buttons (класи elementor-button у розмітці).
   Тут лише розкладка, щоб не перебивати стилі проєкту. */
.mini-cart__checkout{
	display:flex;align-items:center;justify-content:center;gap:6px;
	width:100%;
	text-align:center;
}
.mini-cart__checkout-total{white-space:nowrap}
/* розмір шрифту — як у всіх кнопок сайту (Kit / --theme-button-size), а не як у підсумку */