/* ==========================================================================
   GM Collin — karta produktu (.gmc-card). Wspólna dla karuzeli na stronie głównej i (kolejny etap) listingu sklepu.
   Zmienne --gmc-card-* można nadpisać z Elementora (widget „Produkty”) lub w CSS motywu; fallbacki = wartości ustawione przez użytkownika 2026-09-14.
   ========================================================================== */
.gmc-card { --gmc-hover-time: .25s; position: relative; display: flex; flex-direction: column; height: 100%; text-align: center; }
.gmc-card__info { display: flex; flex-direction: column; flex: 1 1 auto; padding: 22px 8px 0; } /* kolumna: pojemność+cena dosunięte do dołu (margin-top:auto na pojemności) */
.gmc-card__media {
	position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden;
	border: 1px solid var(--gmc-card-border, #ebebeb); background: var(--gmc-card-bg, #ffffff); padding: var(--gmc-card-pad, 24px);
	transition: background-color var(--gmc-hover-time), border-color var(--gmc-hover-time);
}
.gmc-card__media img { width: 100%; height: 100%; object-fit: contain; display: block; margin: 0; }
.gmc-card:hover .gmc-card__media { background: var(--gmc-card-bg-hover, #f7f7f7); }
.gmc-card__name { display: block; min-height: 39px; margin: 0 0 8px; font-size: 15px; font-weight: 500; letter-spacing: .02em; text-transform: uppercase; color: #090a0c; text-decoration: none; line-height: 1.3; transition: color var(--gmc-hover-time); } /* min-height = 2 linie (2 × 19,5 px): pojemność i cena na jednej wysokości w całym rzędzie */
.gmc-card__name:hover { color: #8a8a8a; text-decoration: none; }
.gmc-card__subtitle { min-height: 35px; margin: 0 0 8px; font-size: 12px; line-height: 1.45; color: #090a0c; } /* 2 linie (2 × 17,4 px), renderowany także pusty */
.gmc-card__capacity { min-height: 18px; margin: auto 0 10px; font-size: 12px; line-height: 1.5; color: #090a0c; } /* margin-top:auto — pojemność i cena zawsze na dole kafelka: gdy w rzędzie nazwa lub podtytuł zajmą 3 linie (telefon), reszta rzędu i tak się wyrównuje (grid/slider rozciąga kafelki do równej wysokości) */
.gmc-card__price { font-size: 15px; font-weight: 800; color: var(--gmc-price, #090a0c); line-height: 1.4; }
.gmc-card__price .gmc-card__price-main { display: block; }
.gmc-card__price ins { text-decoration: none; color: var(--gmc-price-sale, #9b274e); }
.gmc-card__price del { display: block; margin-top: 6px; font-size: 12px; font-weight: 400; color: var(--gmc-price-muted, #090a0c); text-decoration: none; }
.gmc-card__price del[data-label]::before { content: attr(data-label) " "; }
.gmc-card__price del .woocommerce-Price-amount { text-decoration: line-through; }
.gmc-card__price .wc-price-history, .gmc-card__price .omnibus-price, .gmc-card__price .iworks-omnibus { display: block; margin-top: 4px; font-size: 12px; font-weight: 400; color: var(--gmc-price-muted, #090a0c); }

/* pasek „Dodaj do koszyka” — specyficzność wyższa niż .woocommerce a.button z arkusza WooCommerce */
.gmc-card__cart { margin: 12px 0 0; }
.gmc-card .gmc-card__cart a.button,
.woocommerce .gmc-card .gmc-card__cart a.button,
.gmc-card .gmc-card__cart a.button:hover,
.gmc-card .gmc-card__cart a.button:focus {
	display: block; width: 100%; margin: 0; padding: 15px 12px; border: 0; border-radius: 0; box-shadow: none;
	background: var(--gmc-cart-bg, #ebebeb); color: var(--gmc-cart-color, #3c3c3c); font-size: 13px; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none; letter-spacing: .08em; text-transform: uppercase; /* CTA wersalikami (uwaga klienta 2026-10-07) */
	transition: background-color var(--gmc-hover-time), color var(--gmc-hover-time);
}
.gmc-card .gmc-card__cart a.button:hover, .gmc-card .gmc-card__cart a.button:focus-visible, .woocommerce .gmc-card .gmc-card__cart a.button:hover { background: var(--gmc-cart-bg-hover, #2b2b2b); color: var(--gmc-cart-color-hover, #ffffff); }
.gmc-card .gmc-card__cart a.button.loading { opacity: .6; pointer-events: none; }
.gmc-card .gmc-card__cart a.button.loading::after, .gmc-card .gmc-card__cart a.button.added::after { display: none; }
.gmc-card .gmc-card__cart .added_to_cart { display: block; margin-top: 8px; font-size: 12px; color: var(--gmc-price-muted, #7a7a7a); text-decoration: underline; }
.gmc-card.is-out-of-stock .gmc-card__cart { display: none; }
.gmc-card__badges { position: absolute; top: 12px; right: 12px; z-index: 2; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; pointer-events: none; } /* Promocja / Ostatnie sztuki / Sold out w kolumnie, jak na galerii karty */
.gmc-card__badge { display: block; padding: 5px 10px; border: 1px solid var(--gmc-card-border, #ebebeb); background: #fff; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #1a1a1a; line-height: 1.2; }
.gmc-card__stock { display: block; margin-top: 6px; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #6f6f6f; }

/* Układ: .gmc-card__visual = zdjęcie + pasek koszyka. Desktop z myszą: pasek nasuwa się na dół zdjęcia po najechaniu.
   Mobile/dotyk: .gmc-card__visual ma display:contents, więc kolejność w karcie to zdjęcie → opis → pasek koszyka (jak w makiecie). */
.gmc-card__visual { display: contents; }
.gmc-card__media { order: 1; }
.gmc-card__info { order: 2; }
.gmc-card__cart { order: 3; }
@media (hover: hover) and (min-width: 768px) {
	.gmc-card__visual { display: block; position: relative; }
	.gmc-card__cart { position: absolute; left: 13px; right: 13px; bottom: 13px; margin: 0; z-index: 2; opacity: 0; transform: translateY(6px); pointer-events: none; transition: opacity var(--gmc-hover-time), transform var(--gmc-hover-time); }
	.gmc-card:hover .gmc-card__cart, .gmc-card:focus-within .gmc-card__cart { opacity: 1; transform: none; pointer-events: auto; }
}
@media (max-width: 1024px) { .gmc-card { --gmc-card-pad: 16px; } }
@media (max-width: 767px) { .gmc-card__info { padding-top: 18px; } .gmc-card__cart { margin-top: 16px; } }
