/*
Theme Name:   Gekonowa Pasja
Template:     blocksy
Description:  Motyw potomny Blocksy dla sklepu Gekonowa Pasja
Author:       Gekonowa Pasja
Version:      1.0.0
Text Domain:  gekonowa-pasja
*/

:root {
	/* Zielenie: przyciski, linki, akcenty */
	--gp-green: var(--theme-palette-color-1); /* #697861 */
	--gp-green-dark: var(--theme-palette-color-2); /* #586750 */

	/* Tekst */
	--gp-text: var(--theme-palette-color-3); /* #434F58 */
	--gp-heading: var(--theme-palette-color-4); /* #0E0D12 */

	/* Tła i obramowania */
	--gp-border: var(--theme-palette-color-5); /* #EEEEEE */
	--gp-bg-soft: var(--theme-palette-color-6); /* #F1F1F1 */
	--gp-bg: var(--theme-palette-color-7); /* #F8F8F8 */
	--gp-white: var(--theme-palette-color-8); /* #FFFFFF */

	/* Złoto: gwiazdki ocen, drobne detale */
	--gp-gold: var(--theme-palette-color-9); /* #C9A15A */

	/* Terakota: zakup i promocje */
	--gp-terra: var(--theme-palette-color-10); /* #A85A3B */
	--gp-terra-dark: #8f4a30;
}

/* Terakota: główny przycisk zakupu (strona produktu, koszyk, checkout) */
.single-product .single_add_to_cart_button,
.wc-proceed-to-checkout .checkout-button,
#place_order,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
	--theme-button-background-initial-color: var(--gp-terra);
	--theme-button-background-hover-color: var(--gp-terra-dark);
	--theme-button-text-initial-color: var(--gp-white);
	--theme-button-text-hover-color: var(--gp-white);
}

/* Terakota: promocje */
.onsale,
.wc-block-components-product-sale-badge {
	background-color: var(--gp-terra);
	color: var(--gp-white);
}

.price ins,
.price ins .amount {
	color: var(--gp-terra);
	text-decoration: none;
}

/* Złoto: gwiazdki ocen */
.star-rating span::before,
.star-rating::before,
.stars a {
	color: var(--gp-gold);
}
/* Menu mobilne drill-down */
.gp-drill-source {
	display: none !important;
}

#offcanvas .gp-drill {
	/* Kolory panelu: zmień tylko te 5 wartości, jeśli zmienisz tło panelu */
	--gp-drill-text: #f5f3ea;
	--gp-drill-muted: rgba(245, 243, 234, 0.65);
	--gp-drill-line: rgba(245, 243, 234, 0.14);
	--gp-drill-accent: var(--gp-gold);
	--gp-drill-active: rgba(245, 243, 234, 0.06);

	display: grid;
	overflow: hidden;
	width: 100%;
	font-family: var(--theme-font-family, inherit);
}

#offcanvas .gp-drill__panel {
	grid-area: 1 / 1;
	transition:
		transform 0.28s ease,
		opacity 0.28s ease;
}

#offcanvas .gp-drill__panel.is-entering,
#offcanvas .gp-drill__panel.is-leaving {
	transform: translateX(100%);
}

#offcanvas .gp-drill__panel.is-behind {
	transform: translateX(-30%);
	opacity: 0;
	pointer-events: none;
}

#offcanvas .gp-drill__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

#offcanvas .gp-drill .gp-drill__item,
#offcanvas .gp-drill .gp-drill__back,
#offcanvas .gp-drill .gp-drill__all {
	font-family: inherit;
	line-height: 1.4;
	letter-spacing: normal;
	text-transform: none;
	text-decoration: none;
	-webkit-tap-highlight-color: transparent;
}

#offcanvas .gp-drill .gp-drill__item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	min-height: 52px;
	padding: 14px 4px;
	border: 0;
	border-bottom: 1px solid var(--gp-drill-line);
	border-radius: 0;
	background: none;
	color: var(--gp-drill-text);
	font-size: 16px;
	font-weight: 400;
	text-align: left;
	cursor: pointer;
}

#offcanvas .gp-drill .gp-drill__item:active {
	background: var(--gp-drill-active);
}

#offcanvas .gp-drill .gp-drill__item.is-current {
	color: var(--gp-drill-accent);
}

#offcanvas .gp-drill svg {
	flex: none;
	width: 18px;
	height: 18px;
	color: var(--gp-drill-accent);
}

#offcanvas .gp-drill .gp-drill__back {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 44px;
	margin-bottom: 4px;
	padding: 8px 0;
	border: 0;
	background: none;
	color: var(--gp-drill-muted);
	font-size: 14px;
	font-weight: 400;
	cursor: pointer;
}

#offcanvas .gp-drill .gp-drill__all {
	display: block;
	padding: 4px 4px 16px;
	border-bottom: 1px solid var(--gp-drill-line);
	color: var(--gp-drill-text);
	font-size: 20px;
	font-weight: 500;
}

#offcanvas .gp-drill .gp-drill__all-prefix {
	display: block;
	margin-bottom: 2px;
	color: var(--gp-drill-accent);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

@media (prefers-reduced-motion: reduce) {
	#offcanvas .gp-drill__panel {
		transition: none;
	}
}