/* =========================================================================
   GA – Mini kosár (Bricks WooCommerce mini cart elem)
   A navbar sötét dobozához (#2d2e2b / #4d4f4a / 8px radius) igazítva.
   Az alábbi változókkal az egész panel átszínezhető.
   ========================================================================= */

:root {
	--gawl-mc-bg: #2d2e2b;
	--gawl-mc-border: #4d4f4a;
	--gawl-mc-text: #ffffff;
	--gawl-mc-muted: rgba(255, 255, 255, 0.6);
	--gawl-mc-line: rgba(255, 255, 255, 0.12);
	--gawl-mc-gold: #dba05f;
	--gawl-mc-gold-dark: #ba803f;
	--gawl-mc-radius: 8px;
	--gawl-mc-width: 380px;
	--gawl-mc-font: "Raleway", sans-serif;
	--gawl-mc-font-alt: "Oswald", sans-serif;
}

/* -------------------------------------------------------------------------
   Ikon + darabszám badge
   ---------------------------------------------------------------------- */

.brxe-woocommerce-mini-cart {
	position: relative;
}

.brxe-woocommerce-mini-cart .mini-cart-link {
	position: relative;
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	line-height: 1;
}

.brxe-woocommerce-mini-cart .cart-icon {
	position: relative;
	display: inline-flex;
	align-items: center;
	line-height: 1;
}

.brxe-woocommerce-mini-cart .cart-count {
	position: absolute;
	top: -9px;
	right: -12px;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--gawl-mc-gold);
	color: #2d2e2b;
	border-radius: 999px;
	font-family: var(--gawl-mc-font-alt);
	font-size: 11px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0;
}

/* -------------------------------------------------------------------------
   Legördülő panel
   FONTOS: a display/visibility állítását a Bricks JS-re hagyjuk,
   itt csak pozíciót és megjelenést adunk.
   ---------------------------------------------------------------------- */

.brxe-woocommerce-mini-cart .cart-detail {
	position: absolute;
	top: calc(100% + 16px);
	right: 0;
	left: auto;
	z-index: 999;
	width: var(--gawl-mc-width);
	max-width: calc(100vw - 32px);
	padding: 20px;
	background: var(--gawl-mc-bg);
	border: 1px solid var(--gawl-mc-border);
	border-radius: var(--gawl-mc-radius);
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
	color: var(--gawl-mc-text);
	font-family: var(--gawl-mc-font);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.5;
	text-align: left;
	overflow: visible;
}

/* kis nyíl a panel tetején */
.brxe-woocommerce-mini-cart .cart-detail::before {
	content: "";
	position: absolute;
	top: -7px;
	right: 14px;
	width: 12px;
	height: 12px;
	background: var(--gawl-mc-bg);
	border-left: 1px solid var(--gawl-mc-border);
	border-top: 1px solid var(--gawl-mc-border);
	transform: rotate(45deg);
}

.brxe-woocommerce-mini-cart .widget_shopping_cart_content {
	display: block;
}

/* -------------------------------------------------------------------------
   Fejléc (plugin által beszúrva)
   ---------------------------------------------------------------------- */

.ga-mini-cart__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 14px;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--gawl-mc-line);
}

.ga-mini-cart__title {
	font-family: var(--gawl-mc-font-alt);
	font-size: 18px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--gawl-mc-text);
}

.ga-mini-cart__count {
	font-family: var(--gawl-mc-font);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--gawl-mc-muted);
	white-space: nowrap;
}

/* -------------------------------------------------------------------------
   Terméklista
   ---------------------------------------------------------------------- */

.brxe-woocommerce-mini-cart .woocommerce-mini-cart.cart_list,
.brxe-woocommerce-mini-cart ul.cart_list {
	list-style: none;
	margin: 0;
	padding: 0;
	max-height: 46vh;
	overflow-y: auto;
	overscroll-behavior: contain;
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item {
	position: relative;
	margin: 0;
	padding: 14px 30px 14px 0;
	border-bottom: 1px solid var(--gawl-mc-line);
	list-style: none;
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item:first-child {
	padding-top: 4px;
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item:last-child {
	border-bottom: 0;
	padding-bottom: 4px;
}

/* a terméknév linkje tartalmazza a képet is */
.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item > a:not(.remove) {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	color: var(--gawl-mc-text);
	font-family: var(--gawl-mc-font-alt);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.3;
	text-decoration: none;
	transition: color 0.2s ease;
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item > a:not(.remove):hover {
	color: var(--gawl-mc-gold);
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item img {
	flex: 0 0 56px;
	width: 56px;
	height: 56px;
	margin: 0;
	float: none;
	object-fit: cover;
	border-radius: 4px;
	background: #f5f4ef;
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item .quantity {
	display: block;
	margin-top: 6px;
	padding-left: 70px;
	font-family: var(--gawl-mc-font);
	font-size: 13px;
	font-weight: 600;
	color: var(--gawl-mc-muted);
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item .quantity .amount {
	color: var(--gawl-mc-text);
}

/* variáció adatok */
.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item .variation {
	margin: 4px 0 0 70px;
	font-size: 12px;
	line-height: 1.4;
	color: var(--gawl-mc-muted);
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item .variation dt,
.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item .variation dd {
	display: inline;
	margin: 0;
	padding: 0;
	font-weight: 500;
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item .variation dd::after {
	content: " ";
}

/* törlés gomb */
.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item a.remove,
.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item a.remove_from_cart_button {
	position: absolute;
	top: 12px;
	right: 0;
	left: auto;
	width: 22px;
	height: 22px;
	display: flex !important;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0;
	background: transparent !important;
	color: var(--gawl-mc-muted) !important;
	border-radius: 999px;
	font-size: 16px;
	line-height: 1;
	text-decoration: none;
	transition: color 0.2s ease, background 0.2s ease;
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item a.remove:hover,
.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item a.remove_from_cart_button:hover {
	background: rgba(255, 255, 255, 0.12) !important;
	color: #ffffff !important;
}

/* -------------------------------------------------------------------------
   Részösszeg
   ---------------------------------------------------------------------- */

.brxe-woocommerce-mini-cart .woocommerce-mini-cart__total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin: 0;
	padding: 16px 0 0;
	border-top: 1px solid var(--gawl-mc-line);
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart__total strong {
	font-family: var(--gawl-mc-font);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--gawl-mc-muted);
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart__total .amount {
	font-family: var(--gawl-mc-font-alt);
	font-size: 18px;
	font-weight: 600;
	color: var(--gawl-mc-text);
	white-space: nowrap;
}

/* -------------------------------------------------------------------------
   Gombok
   ---------------------------------------------------------------------- */

.brxe-woocommerce-mini-cart .woocommerce-mini-cart__buttons {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	margin: 16px 0 0;
	padding: 0;
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart__buttons .button,
.brxe-woocommerce-mini-cart .ga-mini-cart__btn {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 44px;
	margin: 0 !important;
	padding: 12px 14px !important;
	border-radius: var(--gawl-mc-radius) !important;
	font-family: var(--gawl-mc-font-alt) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.1 !important;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
	text-decoration: none !important;
	box-shadow: none !important;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

/* másodlagos (Kosár / View cart) */
.brxe-woocommerce-mini-cart .woocommerce-mini-cart__buttons .button:not(.checkout),
.brxe-woocommerce-mini-cart .ga-mini-cart__btn--ghost {
	background: transparent !important;
	color: var(--gawl-mc-gold) !important;
	border: 1px solid var(--gawl-mc-gold) !important;
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart__buttons .button:not(.checkout):hover,
.brxe-woocommerce-mini-cart .ga-mini-cart__btn--ghost:hover {
	background: var(--gawl-mc-gold) !important;
	color: #2d2e2b !important;
}

/* elsődleges (Pénztár / Checkout) */
.brxe-woocommerce-mini-cart .woocommerce-mini-cart__buttons .button.checkout,
.brxe-woocommerce-mini-cart .ga-mini-cart__btn--solid {
	background: var(--gawl-mc-gold) !important;
	color: #2d2e2b !important;
	border: 1px solid var(--gawl-mc-gold) !important;
}

.brxe-woocommerce-mini-cart .woocommerce-mini-cart__buttons .button.checkout:hover,
.brxe-woocommerce-mini-cart .ga-mini-cart__btn--solid:hover {
	background: var(--gawl-mc-gold-dark) !important;
	border-color: var(--gawl-mc-gold-dark) !important;
	color: #ffffff !important;
}

/* -------------------------------------------------------------------------
   Üres kosár
   ---------------------------------------------------------------------- */

.brxe-woocommerce-mini-cart .woocommerce-mini-cart__empty-message {
	margin: 0;
	padding: 4px 0 0;
	font-size: 14px;
	color: var(--gawl-mc-muted);
}

.brxe-woocommerce-mini-cart .ga-mini-cart__continue {
	margin: 16px 0 0;
	padding: 0;
}

/* -------------------------------------------------------------------------
   Mobil (767px alatt) – a panel nem lóghat ki a képernyőről.
   A Bricks ID-vel írja felül a szélességet, ezért kell itt az !important.
   ---------------------------------------------------------------------- */

@media (max-width: 767px) {

	.brxe-woocommerce-mini-cart .cart-detail {
		position: absolute !important;
		top: calc(100% + 14px) !important;
		right: auto !important;
		left: 50% !important;
		transform: translateX(-50%) !important;
		width: min(340px, calc(100vw - 32px)) !important;
		max-width: calc(100vw - 32px) !important;
		padding: 18px !important;
	}

	.brxe-woocommerce-mini-cart .cart-detail::before {
		right: auto;
		left: 50%;
		margin-left: -6px;
	}

	.brxe-woocommerce-mini-cart .woocommerce-mini-cart.cart_list,
	.brxe-woocommerce-mini-cart ul.cart_list {
		max-height: 38vh;
	}

	.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item img {
		flex: 0 0 48px;
		width: 48px;
		height: 48px;
	}

	.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item .quantity,
	.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item .variation {
		padding-left: 62px;
		margin-left: 0;
	}

	.brxe-woocommerce-mini-cart .woocommerce-mini-cart-item .variation {
		margin-left: 62px;
		padding-left: 0;
	}
}

@media (max-width: 400px) {

	.brxe-woocommerce-mini-cart .woocommerce-mini-cart__buttons {
		grid-template-columns: 1fr;
	}
}
