/*
Theme Name: Stella Green Shop Child
Theme URI: https://stella-green.pl/
Description: Motyw potomny dla Stella Green Shop 1.0.0; zachowuje style i ustawienia motywu nadrzędnego.
Author: SEMER S.C.
Template: stella-green-shop
Version: 1.1.0
Requires PHP: 7.4
Text Domain: stella-green-shop-child
*/
/* Dodawaj własne reguły CSS poniżej. */

/* Stella Green: fotografie produktów bez przycinania — 2026-10 */
.product-card > a:first-of-type,
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
  display: block;
}
.product-card img,
.woocommerce ul.products li.product img,
.woocommerce-page ul.products li.product img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  object-position: center;
  background: #fff;
  border-radius: 6px;
}
.woocommerce div.product div.images img,
.woocommerce div.product div.images .woocommerce-product-gallery__image img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: center;
}
.woocommerce div.product div.images .flex-control-thumbs img {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  object-position: center;
  border-radius: 5px;
}

/* Strona główna: grafiki bez kadrowania i spójne karty — etap 2 */
body.home .category-card {
  background-color: #0b4a2b;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right center;
  isolation: isolate;
}
body.home .category-card::before {
  background: linear-gradient(90deg, rgba(6, 57, 30, .98) 0%, rgba(6, 57, 30, .85) 48%, rgba(6, 57, 30, .18) 100%);
}
body.home .cards .product-card img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  object-position: center;
  background: #fff;
}
body.home .cards .product-card > a:first-of-type {
  display: block;
  min-width: 0;
}
body.home .story .two-col > img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 300px;
  object-fit: contain;
  object-position: center;
}
@media (max-width: 800px) {
  body.home .hero {
    background-position: 65% center;
  }
  body.home .category-card {
    background-position: right center;
  }
}

/* Korekta ekspozycji zdjęć kafelków – 2026-10-30 */
body.home .category-card {
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
body.home .category-card::before {
  background: linear-gradient(90deg, rgba(4,44,25,.83) 0%, rgba(4,44,25,.48) 48%, rgba(4,44,25,.08) 100%);
}
@media (max-width: 800px) {
  body.home .category-card { background-position: center center; }
}

/* Baner strony głównej: usunięcie tła będącego zrzutem całej strony. */
body.home section.hero {
  min-height: 440px;
  background-image: url('https://stella-green.pl/wp-content/uploads/2026/10/stella-green-kategoria-kratki-parkingowe.webp') !important;
  background-size: cover;
  background-position: center 56%;
  background-repeat: no-repeat;
  isolation: isolate;
}
body.home section.hero::before {
  background: linear-gradient(90deg, rgba(255,255,255,.97) 0%, rgba(255,255,255,.92) 34%, rgba(255,255,255,.45) 62%, rgba(255,255,255,.04) 100%);
}
body.home section.hero .hero-content {max-width: 600px; padding: 52px 0;}
body.home section.hero h1 {font-size: clamp(30px,3.6vw,50px);line-height:1.12;}
body.home section.hero h2 {font-size:clamp(18px,2vw,25px);line-height:1.25;}
@media(max-width:800px) {
  body.home section.hero {min-height: 470px; background-position: 58% center;}
  body.home section.hero::before {background:linear-gradient(90deg,rgba(255,255,255,.97),rgba(255,255,255,.80) 75%,rgba(255,255,255,.40));}
  body.home section.hero .hero-content {padding:36px 0;}
}

/* Mobile: karty produktow i opisy bez przycinania (2026-10-30) */
@media (max-width: 767px) {
  body.home .cards,
  .woocommerce ul.products,
  .woocommerce-page ul.products {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 10px;
    align-items: stretch;
  }
  body.home .cards > .product-card,
  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product {
    box-sizing: border-box;
    float: none;
    clear: none;
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
    margin: 0 !important;
    overflow: hidden;
  }
  .product-card,
  .woocommerce ul.products li.product {
    overflow-wrap: anywhere;
  }
  .product-card > a:first-of-type,
  .woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
    min-width: 0;
    max-width: 100%;
  }
  body.home .cards .product-card img,
  .product-card img,
  .woocommerce ul.products li.product img,
  .woocommerce-page ul.products li.product img {
    display: block;
    box-sizing: border-box;
    width: 100% !important;
    max-width: 100%;
    height: auto !important;
    aspect-ratio: 1 / 1;
    object-fit: contain !important;
    object-position: center;
    background-color: #fff;
  }
  .product-card h3,
  .product-card .product-title,
  .woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 14px;
    line-height: 1.4;
    white-space: normal;
    overflow-wrap: anywhere;
    margin: 10px 0 6px;
  }
  .product-card p,
  .product-card .description {
    font-size: 13px;
    line-height: 1.5;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .product-card .price,
  .woocommerce ul.products li.product .price {
    font-size: 15px;
    line-height: 1.4;
  }
  .woocommerce div.product div.images,
  .woocommerce div.product div.summary {
    float: none;
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
  .woocommerce div.product div.images img,
  .woocommerce div.product div.images .woocommerce-product-gallery__image img {
    max-width: 100%;
    height: auto !important;
    object-fit: contain;
  }
  .woocommerce div.product .woocommerce-product-details__short-description,
  .woocommerce div.product .woocommerce-Tabs-panel {
    max-width: 100%;
    overflow-wrap: anywhere;
    font-size: 15px;
    line-height: 1.6;
  }
  .woocommerce div.product .woocommerce-product-details__short-description h1,
  .woocommerce div.product .woocommerce-product-details__short-description h1 * {
    font-size: inherit !important;
    line-height: 1.5 !important;
    font-weight: inherit;
  }
  .woocommerce div.product .woocommerce-product-details__short-description ul,
  .woocommerce div.product .woocommerce-Tabs-panel ul {
    padding-left: 1.25em;
    margin-left: 0;
  }
  .woocommerce div.product .woocommerce-product-details__short-description img,
  .woocommerce div.product .woocommerce-Tabs-panel img {
    max-width: 100%;
    height: auto;
  }
}
@media (max-width: 359px) {
  body.home .cards,
  .woocommerce ul.products,
  .woocommerce-page ul.products {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Stopka: linki w kolumnie Informacje, platnosci w kolumnie Dystrybutor */
.sg-footer-links {display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-top:10px}
.sg-footer-links a {display:block;color:inherit;text-decoration:none;font-size:inherit;line-height:1.5}
.sg-footer-links a:hover,.sg-footer-links a:focus{text-decoration:underline}
.sg-footer-payment-methods{margin-top:20px;max-width:100%}
.sg-footer-payment-methods img{display:block;width:245px;max-width:100%;height:auto;object-fit:contain;border-radius:0}
@media(max-width:767px){.sg-footer-payment-methods{margin-top:16px}}

/* Stopka: wektorowe logotypy płatności, tekstowy nagłówek i biały zaokrąglony panel */
.sg-footer-payment-methods { margin-top:20px; max-width:100%; }
.sg-footer-payment-methods .sg-payments-title { color:#fff; font-size:15px; font-weight:700; line-height:1.4; margin:0 0 10px; }
.sg-footer-payment-methods .sg-payments-logos { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-start; gap:14px; width:max-content; max-width:100%; box-sizing:border-box; background:#fff; border-radius:12px; padding:13px 16px; }
.sg-footer-payment-methods .sg-payments-logos img { display:block; width:auto; height:27px; max-width:70px; object-fit:contain; background:transparent; border:0; border-radius:0; }
@media(max-width:767px){.sg-footer-payment-methods .sg-payments-logos{gap:12px;padding:12px;}.sg-footer-payment-methods .sg-payments-logos img{height:24px;max-width:64px;}}
