/* GabStyle — WooCommerce stílusok (Phase 05).
   A WooCommerce alap CSS-re rétegezve, a GabStyle Atelier webshop dizájn szerint. */

/* ====================== Shop hero ====================== */
.gs-shop-hero {
	position: relative;
	background-size: cover;
	background-position: center;
	text-align: center;
	margin-bottom: var(--space-7);
}
.gs-shop-hero::before { content: ""; position: absolute; inset: 0; background: rgba(247,240,230,0.82); }
.gs-shop-hero__inner { position: relative; z-index: 2; max-width: var(--container-narrow); margin: 0 auto; padding: clamp(3rem, 7vw, 5rem) var(--gutter); }
.gs-shop-hero .gs-eyebrow { display: block; margin-bottom: var(--space-3); }
.gs-shop-hero h1 { font-size: var(--text-h1); margin: 0 0 var(--space-3); }
.gs-shop-hero p { color: var(--text-body); margin: var(--space-4) auto 0; max-width: 600px; }
.gs-shop-hero .gs-divider { margin-inline: auto; }

/* ====================== Shop layout (sidebar + grid) ====================== */
.gs-shop { display: grid; grid-template-columns: 232px 1fr; gap: 44px; align-items: start; padding-bottom: var(--section-y); }
.gs-shop__filters { position: sticky; top: 98px; }
.gs-shop__main { min-width: 0; }

@media (max-width: 900px) {
	.gs-shop { grid-template-columns: 1fr; gap: var(--space-4); }
	.gs-shop__filters { position: static; }
}

/* Szűrők */
.gs-filter-group { margin-bottom: var(--space-6); }
.gs-filter-head {
	font-family: var(--font-sans); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.16em;
	text-transform: uppercase; color: var(--text-muted); margin: 0 0 var(--space-3);
	padding-bottom: 10px; border-bottom: 1px solid var(--border);
}
.gs-filter-tags { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.gs-tagbtn {
	display: inline-flex; padding: 6px 14px; font-family: var(--font-sans); font-size: 0.8125rem; font-weight: 600;
	color: var(--brown-700); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-pill);
	transition: all var(--dur-fast) var(--ease);
}
.gs-tagbtn:hover { border-color: var(--gold-400); color: var(--gold-600); }
.gs-tagbtn.is-active { background: var(--brown-800); color: var(--cream-50); border-color: var(--brown-800); }
.gs-checkrow { display: flex; align-items: center; gap: 10px; padding: 6px 0; color: var(--text-body); font-size: 0.9rem; }
.gs-checkrow:hover { color: var(--brown-800); }
.gs-checkbox {
	width: 18px; height: 18px; border-radius: 4px; border: 1px solid var(--border-strong);
	background: var(--surface); display: grid; place-items: center; flex: 0 0 auto; color: var(--cream-50);
}
.gs-checkrow.is-active .gs-checkbox { background: var(--brown-800); border-color: var(--brown-800); }

/* Szűrők mobil-toggle */
.gs-shop__filters-toggle { display: none; }
@media (max-width: 900px) {
	.gs-shop__filters-toggle {
		display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; margin-bottom: var(--space-3);
		font-family: var(--font-sans); font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
		color: var(--brown-800); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-button); cursor: pointer;
	}
	.gs-filters-body { display: none; padding: var(--space-4) 0; border-bottom: 1px solid var(--border); margin-bottom: var(--space-4); }
	.gs-filters-body.is-open { display: block; }
}

/* Felső sor: találatszám + rendezés */
.gs-shop__main .woocommerce-result-count { color: var(--text-muted); font-size: 0.85rem; margin: 0; float: none; display: inline-block; }
.gs-shop__main .woocommerce-ordering { margin: 0; float: right; }
.gs-shop__main .woocommerce-ordering select {
	font-family: var(--font-sans); font-size: 0.85rem; color: var(--text-body); background: var(--surface);
	border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 9px 12px;
}
.gs-shop__main::after { content: ""; display: table; clear: both; }

/* ====================== Termékrács + kártya ====================== */
.woocommerce ul.products,
.woocommerce-page ul.products {
	display: grid !important; grid-template-columns: repeat(2, 1fr); gap: 24px; margin: 24px 0 0; padding: 0; list-style: none;
}
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none !important; content: none !important; }
/* Tablet: 3 oszlop. Nagy képernyő: a columns-N osztály szerint (shop=3, kezdőlap kiemelt=4). */
@media (min-width: 768px) {
	.woocommerce ul.products { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 992px) {
	.woocommerce ul.products.columns-4 { grid-template-columns: repeat(4, 1fr); }
	.woocommerce ul.products.columns-5 { grid-template-columns: repeat(5, 1fr); }
}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	position: relative; width: auto !important; float: none !important; margin: 0 !important; padding: 0 !important;
	background: var(--surface-card); border: 1px solid var(--border); border-radius: var(--radius-card);
	overflow: hidden; display: flex; flex-direction: column;
	box-shadow: var(--shadow-xs); transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.woocommerce ul.products li.product:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); }
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link { display: block; }
.woocommerce ul.products li.product .gs-loop-badge { position: absolute; top: 12px; left: 12px; z-index: 3; }
.woocommerce ul.products li.product img {
	margin: 0 !important; border-radius: 0; aspect-ratio: 4 / 5; object-fit: cover; width: 100%; display: block;
	transition: transform var(--dur-slow) var(--ease); background: var(--cream-200);
}
.woocommerce ul.products li.product:hover img { transform: scale(1.04); }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--font-display); font-size: 1.3125rem; font-weight: 500; color: var(--text-heading);
	line-height: 1.2; padding: 16px 18px 0; margin: 0;
}
.woocommerce ul.products li.product .price {
	color: var(--brown-800); font-family: var(--font-sans); font-weight: 700; font-size: 1rem;
	padding: 6px 18px 0; margin: 0;
}
.woocommerce ul.products li.product .price del { color: var(--taupe-500); font-weight: 400; margin-right: 6px; }
.woocommerce ul.products li.product .price ins { text-decoration: none; }
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart {
	margin: 14px 18px 18px; text-align: center;
}

/* Loop „Kosárba"/„Egyeztetést kérek" gomb = ghost stílus */
.woocommerce ul.products li.product .button {
	display: block; background: transparent; color: var(--btn-ghost-fg); border: 1px solid var(--btn-ghost-border);
	border-radius: var(--radius-button); padding: 10px 16px; font-family: var(--font-sans); font-size: 0.8125rem;
	font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; transition: all var(--dur-fast) var(--ease);
}
.woocommerce ul.products li.product .button:hover { background: var(--cream-200); color: var(--brown-800); }
.woocommerce ul.products li.product .added_to_cart { display: block; text-align: center; color: var(--gold-600); font-size: 0.8125rem; font-weight: 600; }

@media (max-width: 767px) { .woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: repeat(2, 1fr); gap: 16px; } }
@media (max-width: 480px) {
	.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 1.1rem; padding: 12px 12px 0; }
	.woocommerce ul.products li.product .price { padding-inline: 12px; }
	.woocommerce ul.products li.product .button { margin: 12px; }
}

/* ====================== Badge ====================== */
.gs-badge {
	display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; font-family: var(--font-sans);
	font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; line-height: 1;
	border-radius: var(--radius-pill); white-space: nowrap; border: 1px solid transparent;
}
.gs-badge__dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: 0 0 auto; }
.gs-badge--stock { color: var(--success-fg); background: var(--success-bg); border-color: rgba(124,135,101,0.30); }
.gs-badge--order { color: var(--gold-600); background: #F6EEDD; border-color: rgba(194,160,94,0.35); }
.gs-badge--neutral { color: var(--brown-700); background: var(--cream-200); border-color: var(--sand-300); }

/* Alap WooCommerce sale jelvény elrejtése */
.woocommerce span.onsale { display: none !important; }

/* „Megye" (state) mező elrejtése — klasszikus ÉS blokk pénztárban (nem kérjük). */
#billing_state_field,
#shipping_state_field,
.woocommerce-billing-fields #billing_state_field,
.wc-block-components-address-form__state,
.wc-block-components-address-form .wc-block-components-state-input {
	display: none !important;
}

/* ====================== Egyszeri (single) termékoldal ====================== */
.woocommerce div.product { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; padding-block: var(--space-7); }
/* A WooCommerce 48%-ra úsztatja a galériát/összegzést — a rácsban felülírjuk teljes szélességre. */
.woocommerce div.product .woocommerce-product-gallery { width: 100% !important; float: none !important; margin: 0 !important; }
.woocommerce div.product .woocommerce-product-gallery__image img { border-radius: var(--radius-lg); box-shadow: var(--shadow-md); width: 100%; }
.woocommerce div.product .summary { width: 100% !important; float: none !important; margin: 0 !important; }
.woocommerce div.product .product_title {
	font-family: var(--font-display); font-size: var(--text-h1); line-height: 1.1; color: var(--text-heading); margin: 0 0 var(--space-2);
}
.woocommerce div.product p.price, .woocommerce div.product span.price {
	font-family: var(--font-display); font-size: 2.2rem; color: var(--text-heading); margin: 0 0 var(--space-3);
}
.woocommerce div.product p.price del { font-size: 1.2rem; color: var(--taupe-500); }
.gs-single-badges { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: var(--space-5); }
.woocommerce div.product .woocommerce-product-details__short-description { color: var(--text-body); margin-bottom: var(--space-5); max-width: 48ch; }

/* Mennyiség + Kosárba */
.woocommerce div.product form.cart { display: flex; gap: 14px; align-items: stretch; margin-bottom: var(--space-5); }
.woocommerce div.product form.cart .quantity { display: flex; align-items: center; border: 1px solid var(--border-strong); border-radius: var(--radius-button); }
.woocommerce div.product form.cart .quantity input.qty {
	width: 56px; height: 100%; min-height: 50px; border: none; background: transparent; text-align: center;
	font-family: var(--font-sans); color: var(--brown-800);
}
.woocommerce div.product form.cart .single_add_to_cart_button {
	flex: 1; background: var(--btn-primary-bg); color: var(--btn-primary-fg); border: none; border-radius: var(--radius-button);
	padding: 16px 32px; font-family: var(--font-sans); font-size: 0.9375rem; font-weight: 600; letter-spacing: 0.12em;
	text-transform: uppercase; cursor: pointer; transition: background var(--dur-fast) var(--ease);
}
.woocommerce div.product form.cart .single_add_to_cart_button:hover { background: var(--btn-primary-hover); }

/* Egyedileg készülő (made-to-order) tájékoztató */
.gs-mto { padding: 0 0 var(--space-4); }
.gs-mto__note {
	background: #F6EEDD; border: 1px solid rgba(194,160,94,0.35); border-radius: var(--radius-card);
	padding: 16px 18px; color: var(--brown-700); font-size: 0.95rem; line-height: 1.6; margin: 0;
}

/* Egyedi-kérés szövegmező a termékoldalon (az add-to-cart form fölött) */
.gs-order-note { margin: 0 0 var(--space-4); width: 100%; }
.gs-order-note label {
	display: block; font-family: var(--font-sans); font-size: var(--text-sm); font-weight: 600;
	color: var(--brown-800); margin-bottom: var(--space-2);
}
.gs-order-note textarea {
	width: 100%; font-family: var(--font-sans); font-size: var(--text-body); color: var(--text-body);
	background: var(--ivory); border: 1px solid var(--border); border-radius: var(--radius-sm);
	padding: 12px 14px; min-height: 96px; resize: vertical;
}
.gs-order-note textarea:focus { outline: none; border-color: var(--gold-400); box-shadow: 0 0 0 3px var(--focus-ring); }
/* A made-to-order terméknél a form teljes szélességű elrendezés, hogy a mező jól nézzen ki. */
.woocommerce div.product form.cart { flex-wrap: wrap; }
.woocommerce div.product form.cart .gs-order-note { flex: 1 1 100%; }

/* ====================== Termék-variációk (pl. Szín) ====================== */
.woocommerce div.product form.cart .variations {
	width: 100%; margin: 0 0 var(--space-4); border: none; display: block;
}
.woocommerce div.product form.cart .variations tbody,
.woocommerce div.product form.cart .variations tr { display: block; }
.woocommerce div.product form.cart .variations th,
.woocommerce div.product form.cart .variations td {
	display: block; width: 100%; padding: 0; border: none; background: none;
}
.woocommerce div.product form.cart .variations th.label {
	font-family: var(--font-sans); font-size: var(--text-sm); font-weight: 600;
	color: var(--brown-800); margin-bottom: var(--space-2); line-height: 1.3;
}
.woocommerce div.product form.cart .variations td.value { margin-bottom: var(--space-3); }
.woocommerce div.product form.cart .variations select {
	width: 100%; font-family: var(--font-sans); font-size: var(--text-body); color: var(--text-body);
	background: var(--ivory); border: 1px solid var(--border); border-radius: var(--radius-sm);
	padding: 12px 14px; min-height: 48px; transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}
.woocommerce div.product form.cart .variations select:focus {
	outline: none; border-color: var(--gold-400); box-shadow: 0 0 0 3px var(--focus-ring);
}
.woocommerce div.product form.cart .reset_variations {
	display: inline-block; margin-top: var(--space-2); font-family: var(--font-sans);
	font-size: var(--text-sm); color: var(--gold-600);
}
.woocommerce div.product form.cart .reset_variations:hover { color: var(--caramel-600); }
.woocommerce div.product .single_variation_wrap { width: 100%; }
.woocommerce div.product .single_variation .price {
	font-family: var(--font-display); font-size: 1.8rem; color: var(--text-heading); margin-bottom: var(--space-3); display: block;
}
.woocommerce div.product .woocommerce-variation-add-to-cart {
	display: flex; gap: 14px; align-items: stretch; flex-wrap: wrap;
}
.woocommerce div.product .woocommerce-variation-add-to-cart .quantity { display: flex; align-items: center; border: 1px solid var(--border-strong); border-radius: var(--radius-button); }
.woocommerce div.product .woocommerce-variation-add-to-cart .single_add_to_cart_button { flex: 1; }

/* Termékadatok / fülek */
.woocommerce div.product .woocommerce-tabs { grid-column: 1 / -1; margin-top: var(--space-6); }
.woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0; margin: 0 0 var(--space-4); border-bottom: 1px solid var(--border); display: flex; gap: 4px; flex-wrap: wrap; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: transparent; border: none; border-radius: 0; margin: 0; padding: 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	font-family: var(--font-sans); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
	color: var(--text-muted); padding: 12px 16px; display: block; border-bottom: 2px solid transparent;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--brown-800); border-bottom-color: var(--gold-500); }
.woocommerce div.product .woocommerce-tabs .panel { padding: var(--space-3) 0; color: var(--text-body); }
.woocommerce div.product .woocommerce-tabs table.shop_attributes th { color: var(--brown-800); }

@media (max-width: 860px) {
	.woocommerce div.product { grid-template-columns: 1fr; gap: var(--space-5); }
	.woocommerce div.product .product_title { font-size: var(--text-h2); }
}

/* Kapcsolódó termékek */
.woocommerce .related.products, .woocommerce .upsells.products { grid-column: 1 / -1; }
.woocommerce .related.products > h2, .woocommerce .upsells.products > h2 { text-align: center; font-size: var(--text-h2); margin-bottom: var(--space-5); }

/* ====================== Gombok általában (WooCommerce .button) ====================== */
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,
.woocommerce #respond input#submit.alt {
	background: var(--btn-primary-bg); color: var(--btn-primary-fg); border-radius: var(--radius-button);
	font-family: var(--font-sans); font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
}
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover { background: var(--btn-primary-hover); }
.woocommerce .button { border-radius: var(--radius-button); }

/* ====================== Kosár ====================== */
.woocommerce table.shop_table { border-radius: var(--radius-card); border-color: var(--border); }
.woocommerce table.shop_table th { font-family: var(--font-sans); color: var(--brown-800); }
.woocommerce .cart_totals h2 { font-size: var(--text-h3); }
.woocommerce-cart .cart-collaterals .cart_totals { background: var(--surface-card); border: 1px solid var(--border); border-radius: var(--radius-card); padding: var(--space-4); }
.woocommerce a.remove { color: var(--caramel-600) !important; border-color: var(--caramel-600); }
.woocommerce a.remove:hover { background: var(--caramel-600) !important; color: var(--cream-50) !important; }

/* ====================== Checkout ====================== */
.woocommerce-checkout #payment { background: var(--surface-card); border: 1px solid var(--border); border-radius: var(--radius-card); }
.woocommerce-checkout .woocommerce-checkout-review-order-table { background: var(--surface); }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select {
	border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 12px 14px; background: var(--ivory); color: var(--text-body);
}
.woocommerce form .form-row input.input-text:focus, .woocommerce form .form-row textarea:focus {
	border-color: var(--gold-400); box-shadow: 0 0 0 3px var(--focus-ring); outline: none;
}
.woocommerce-checkout h3 { font-size: var(--text-h3); }

/* ====================== Üres kosár ====================== */
.gs-cart-empty { text-align: center; padding: var(--space-8) var(--gutter); max-width: 560px; margin: 0 auto; }
.gs-cart-empty .gs-divider { margin: var(--space-4) auto; }
.gs-cart-empty p { font-size: var(--text-body-lg); color: var(--text-body); margin-bottom: var(--space-5); }

/* ====================== Értesítők ====================== */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews {
	border-radius: var(--radius-sm); border-top: none; font-family: var(--font-sans);
}
.woocommerce-message { background: var(--success-bg); color: var(--success-fg); border-left: 3px solid var(--sage-600); }
.woocommerce-message::before { color: var(--sage-600); }
.woocommerce-info { background: var(--bg-subtle); color: var(--brown-700); border-left: 3px solid var(--gold-500); }
.woocommerce-info::before { color: var(--gold-600); }
.woocommerce-error { background: var(--error-bg); color: var(--error-fg); border-left: 3px solid var(--error-fg); }

/* ====================== Lapozó ====================== */
.woocommerce nav.woocommerce-pagination ul { border: none; gap: 6px; display: flex; justify-content: center; }
.woocommerce nav.woocommerce-pagination ul li { border: none; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span {
	border: 1px solid var(--border); border-radius: var(--radius-sm); color: var(--brown-700); padding: 8px 14px;
}
.woocommerce nav.woocommerce-pagination ul li span.current { background: var(--brown-800); color: var(--cream-50); border-color: var(--brown-800); }