/*
Theme Name: Supro Child
Theme URI: http://drfuri.com/supro
Author: DrFuri
Author URI: http://drfuri.com
Description: Supro Child Theme.
Version: 1.0
License: GNU General Public License v2+
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: supro
Domain Path: /lang/
Tags: one-column, two-columns, left-sidebar, right-sidebar, full-width-template, post-formats, theme-options, threaded-comments, translation-ready
Template: supro
*/

/*
Theme Name: Supro Child
Template: supro
*/

/* ===== USTAWIENIA BRAND ===== */
:root{
  --woo-primary: #1e3791;     /* kolor główny */
  --woo-primary-hover: #182b70;
  --woo-contrast: #fff;
  --totals-x: 24px;           /* boczny padding w podsumowaniu */
}

/* ===== PRZYCISKI (bez overlay w siatce produktów i serduszka) ===== */

/* Główne przyciski (single product, koszyk, checkout, konto, Woo Blocks) */
.woocommerce a.button:not(.add_to_cart_button):not(.wcboost-wishlist-button):not(.wcboost-products-compare-button):not(.yith-wcwl-add-to-wishlist),
.woocommerce button.button:not(.add_to_cart_button):not(.wcboost-wishlist-button):not(.wcboost-products-compare-button):not(.yith-wcwl-add-to-wishlist),
.woocommerce input.button:not(.add_to_cart_button):not(.wcboost-wishlist-button):not(.wcboost-products-compare-button):not(.yith-wcwl-add-to-wishlist),
.woocommerce #respond input#submit,
.single_add_to_cart_button, /* przycisk na stronie produktu */
.woocommerce-cart .button,
.woocommerce-checkout .button,
.woocommerce .woocommerce-Button.button,
.wc-block-cart__submit-button .wc-block-components-button__button,
.wc-block-checkout__actions .wc-block-components-button,
.wc-block-components-button .wc-block-components-button__button,
.wp-element-button:not(.add_to_cart_button):not(.wcboost-wishlist-button):not(.wcboost-products-compare-button):not(.yith-wcwl-add-to-wishlist) {
  background-color: var(--woo-primary) !important;
  color: var(--woo-contrast) !important;
  border: 1px solid var(--woo-primary) !important;
  border-radius: 6px;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}

/* Hover/active/focus */
.woocommerce a.button:not(.add_to_cart_button):not(.wcboost-wishlist-button):not(.wcboost-products-compare-button):not(.yith-wcwl-add-to-wishlist):hover,
.woocommerce button.button:not(.add_to_cart_button):not(.wcboost-wishlist-button):not(.wcboost-products-compare-button):not(.yith-wcwl-add-to-wishlist):hover,
.woocommerce input.button:not(.add_to_cart_button):not(.wcboost-wishlist-button):not(.wcboost-products-compare-button):not(.yith-wcwl-add-to-wishlist):hover,
.woocommerce #respond input#submit:hover,
.single_add_to_cart_button:hover,
.woocommerce-cart .button:hover,
.woocommerce-checkout .button:hover,
.woocommerce .woocommerce-Button.button:hover,
.wc-block-components-button .wc-block-components-button__button:hover {
  background-color: var(--woo-primary-hover) !important;
  border-color: var(--woo-primary-hover) !important;
  color: var(--woo-contrast) !important;
}

/* Disabled */
.woocommerce .button.disabled,
.woocommerce .button:disabled,
.woocommerce .button:disabled[disabled],
.wc-block-components-button[disabled] {
  opacity: .6;
  cursor: not-allowed;
}

/* Wyraźne WYKLUCZENIE overlay w kartach produktów (zostaw styl motywu) */
.products .product .add_to_cart_button,
.products .product .wcboost-wishlist-button,
.products .product .wcboost-products-compare-button,
.products .product .yith-wcwl-add-to-wishlist {
  background: initial !important;
  color: inherit !important;
  border: initial !important;
}

/* ===== CHECKOUT TOTALS (Woo Blocks) — bez separatorów, tytuł 800, „Łącznie” 2rem ===== */

/* Karta podsumowania */
.wc-block-components-totals{
  border: 1px solid #eaeaea;
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}

/* Tytuł: bold 800 */
.wc-block-components-totals__title{
  margin: 0;
  padding: 20px var(--totals-x) 10px;
  font-weight: 800;
}

/* Wyzeruj wewnętrzne paddingi sekcji – kontrola w wierszach */
.wc-block-components-totals__body,
.wc-block-components-totals__footer{
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Wiersze (także footer) – równe odstępy, BEZ separatorów */
.wc-block-components-totals-item,
.wc-block-components-totals-footer-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px var(--totals-x) !important;
  margin: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Przycisk „Dodaj kupony” – takie same boczne paddingi */
.wc-block-components-panel__button{
  padding-left: var(--totals-x) !important;
  padding-right: var(--totals-x) !important;
}

/* „Łącznie” — kolor etykiety i kwoty + typografia */
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label{
  color: var(--woo-primary) !important;
  font-weight: 800;
  line-height: 1.1;
  text-decoration: none !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item .wc-block-formatted-money-amount{
  color: var(--woo-primary) !important;
  font-size: 2rem !important;   /* kwota = 2rem */
  font-weight: 800;
  line-height: 1.1;
  text-decoration: none !important;
}
.wc-block-components-totals-footer-item a{
  color: var(--woo-primary) !important;
  text-decoration: none !important;
}

/* Minimalne wyrównania listy pozycji */
.wc-block-components-order-summary-item__image{ margin-right: 10px; }
.wc-block-components-order-summary-item__quantity-badge{ transform: translate(-2px,-2px); }

/* ===== ILOŚĆ (qty) i przyciski +/- (styl) ===== */
/* Uwaga: do działania +/- potrzebny skrypt JS dodany wcześniej. */
.woocommerce .quantity.has-plusminus{
  display: inline-flex;
  align-items: stretch;
  border: 1px solid var(--woo-primary);
  border-radius: 6px;
  overflow: hidden;
}
.woocommerce .quantity.has-plusminus .qty{
  width: 3.2em;
  text-align: center;
  border: none;
  box-shadow: none !important;
  -moz-appearance: textfield;
}
.woocommerce .quantity.has-plusminus .qty::-webkit-outer-spin-button,
.woocommerce .quantity.has-plusminus .qty::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}
.woocommerce .quantity.has-plusminus .qty-btn{
  min-width: 2.4em;
  padding: 0;
  margin: 0;
  background: var(--woo-primary);
  color: var(--woo-contrast);
  border: none;
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.woocommerce .quantity.has-plusminus .qty-btn:hover{ background: var(--woo-primary-hover); }
.woocommerce .quantity.has-plusminus .qty-btn--minus{ border-right: 1px solid rgba(0,0,0,.08); }
.woocommerce .quantity.has-plusminus .qty-btn--plus{ border-left: 1px solid rgba(0,0,0,.08); }

/* =========================================================
   TYPOGRAFIA – SUPRO + WPBakery + DM Sans (CONTENT ONLY)
   - Nie ingeruje w header/menu/submenu.
   - Footer: tylko widgety (tekst skaluje się).
   - Nadpisuje WPBakery (w tym inline) dzięki !important tam, gdzie trzeba.
   ========================================================= */

:root {
  --bp-tablet: 1024px;
  --bp-mobile: 576px;
}

/* ---------------------------
   SCOPING: obszary treści
---------------------------- */
:where(
  main,
  .site-main,
  .content-area,
  .entry-content,
  .page-content,
  .post-content,
  article,
  .hentry,
  .vc_row,
  .wpb_text_column,
  .wpb_wrapper,
  /* Woo/Supro typowe obszary treści */
  .woocommerce-product-details__short-description,
  .woocommerce div.product .summary,
  .woocommerce div.product .woocommerce-tabs .panel,
  .woocommerce-tabs .panel,
  .woocommerce-review__content,
  .comment-content
) {
  /* DM Sans – optyczne dopasowanie dla lepszej czytelności */
  font-optical-sizing: auto;
  font-family: "DM Sans", Arial, sans-serif;
}

/* ---------------------------------------
   BODY TEXT (bez linków-przycisków)
   Minimalne rozmiary: 16 / 15 / 14
   (UWAGA: NIE tykamy tutaj span / a)
---------------------------------------- */
:where(
  main, .site-main, .content-area, .entry-content, .page-content,
  .post-content, article, .hentry, .vc_row, .wpb_text_column, .wpb_wrapper,
  .woocommerce-product-details__short-description,
  .woocommerce div.product .summary,
  .woocommerce div.product .woocommerce-tabs .panel,
  .woocommerce-tabs .panel,
  .woocommerce-review__content,
  .comment-content
) :where(
  p,
  li,
  blockquote,
  figcaption,
  dd,
  dt
) {
  font-size: 16px !important;   /* desktop minimum */
  line-height: 1.6 !important;
}

@media (max-width: 1024px) {
  :where(
    main, .site-main, .content-area, .entry-content, .page-content,
    .post-content, article, .hentry, .vc_row, .wpb_text_column, .wpb_wrapper,
    .woocommerce-product-details__short-description,
    .woocommerce div.product .summary,
    .woocommerce div.product .woocommerce-tabs .panel,
    .woocommerce-tabs .panel,
    .woocommerce-review__content,
    .comment-content
  ) :where(
    p,
    li,
    blockquote,
    figcaption,
    dd,
    dt
  ) {
    font-size: 16px !important; /* tablet minimum */
  }
}
@media (max-width: 576px) {
  :where(
    main, .site-main, .content-area, .entry-content, .page-content,
    .post-content, article, .hentry, .vc_row, .wpb_text_column, .wpb_wrapper,
    .woocommerce-product-details__short-description,
    .woocommerce div.product .summary,
    .woocommerce div.product .woocommerce-tabs .panel,
    .woocommerce-tabs .panel,
    .woocommerce-review__content,
    .comment-content
  ) :where(
    p,
    li,
    blockquote,
    figcaption,
    dd,
    dt
  ) {
    font-size: 14px !important; /* mobile minimum */
  }
}

/* ---------------------------
   NAGŁÓWKI – Twoja skala
---------------------------- */
:where(
  main, .site-main, .content-area, .entry-content, .page-content,
  .post-content, article, .hentry, .vc_row, .wpb_text_column, .wpb_wrapper,
  .woocommerce-product-details__short-description,
  .woocommerce div.product .summary,
  .woocommerce div.product .woocommerce-tabs .panel,
  .woocommerce-tabs .panel
) h1 { font-size: 36px !important; line-height: 1.2 !important; letter-spacing: -0.01em !important; }

:where(
  main, .site-main, .content-area, .entry-content, .page-content,
  .post-content, article, .hentry, .vc_row, .wpb_text_column, .wpb_wrapper,
  .woocommerce-product-details__short-description,
  .woocommerce div.product .summary,
  .woocommerce div.product .woocommerce-tabs .panel,
  .woocommerce-tabs .panel
) h2 { font-size: 30px !important; line-height: 1.2 !important; letter-spacing: -0.005em !important; }

:where(
  main, .site-main, .content-area, .entry-content, .page-content,
  .post-content, article, .hentry, .vc_row, .wpb_text_column, .wpb_wrapper,
  .woocommerce-product-details__short-description,
  .woocommerce div.product .summary,
  .woocommerce div.product .woocommerce-tabs .panel,
  .woocommerce-tabs .panel
) h3 { font-size: 24px !important; line-height: 1.2 !important; }

:where(
  main, .site-main, .content-area, .entry-content, .page-content,
  .post-content, article, .hentry, .vc_row, .wpb_text_column, .wpb_wrapper,
  .woocommerce-product-details__short-description,
  .woocommerce div.product .summary,
  .woocommerce div.product .woocommerce-tabs .panel,
  .woocommerce-tabs .panel
) h4 { font-size: 18px !important; line-height: 1.2 !important; }

:where(
  main, .site-main, .content-area, .entry-content, .page-content,
  .post-content, article, .hentry, .vc_row, .wpb_text_column, .wpb_wrapper,
  .woocommerce-product-details__short-description,
  .woocommerce div.product .summary,
  .woocommerce div.product .woocommerce-tabs .panel,
  .woocommerce-tabs .panel
) h5 { font-size: 16px !important; line-height: 1.2 !important; }

/* ---------------------------------------
   FOOTER – tylko widgety (ma się skalować)
---------------------------------------- */
footer .widget :where(p, span, li, a, blockquote, figcaption, dd, dt) {
  font-size: 16px !important;
  line-height: 1.6 !important;
}
@media (max-width: 1024px) {
  footer .widget :where(p, span, li, a, blockquote, figcaption, dd, dt) {
    font-size: 16px !important;
  }
}
@media (max-width: 576px) {
  footer .widget :where(p, span, li, a, blockquote, figcaption, dd, dt) {
    font-size: 15px !important;
  }
}

/* =========================================================
   PRZYCISKI SUPRO – centrowanie pion/poziom i brak konfliktu
   (naprawa dla markupu: <div class="supro-button ..."><a class="supro-link">…)
   ========================================================= */

/* Jeden, docelowy zestaw stylów dla .supro-button */
.supro-button {
  display: flex !important;            /* ramka jako flex-kontener */
  justify-content: center !important;  /* środek w poziomie */
  align-items: center !important;      /* środek w pionie */
  width: fit-content;
  margin: 0 auto !important;           /* wyśrodkowanie całej ramki */
  height: auto !important;
  line-height: 1 !important;           /* nie psuje pionu wewnątrz */
  padding: 12px 24px;                  /* wysokość / oddech przycisku */
  box-sizing: border-box;
}

.supro-button .supro-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;           /* reset wszystkich globali */
  text-align: center;
}

/* CTA w banerach – nadpisuje globalne line-height:1.6 */
.supro-banner-grid .banner-btn {
  line-height: 50px !important;        /* wracamy do mechaniki motywu */
}

/* Paginacja / strzałki – bez nadmiarowego odstępu w pionie */
.pagination .page-numbers,
.woocommerce-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1 !important;
}

@media (max-width: 1024px) {
  h1{font-size:32px!important;}
  h2{font-size:26px!important;}
  h3{font-size:22px!important;}
}
@media (max-width: 576px) {
  h1{font-size:28px!important;}
  h2{font-size:22px!important;}
  h3{font-size:20px!important;}
}

/* === GS – twardy override layoutu w zakładce "Opis" === */

/* Kontener: 50% tekst, 10% przerwy, 40% obraz – WYGRYWA z .vc_row */
.vc_row.gs-product-desc {
    display: grid !important;
    grid-template-columns: 50% 40%;
    column-gap: 10%;
    align-items: flex-start;
}

/* Zerujemy float/width od WPBakery na kolumnach wewnątrz tego wiersza */
.vc_row.gs-product-desc > .wpb_column {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    box-sizing: border-box;
}

/* Tekst – lewa kolumna */
.vc_row.gs-product-desc .gs-product-desc__text {
    /* grid załatwia szerokość */
}

/* Obraz – prawa kolumna, trochę niżej niż nagłówek */
@media (min-width: 769px) {
    .vc_row.gs-product-desc .gs-product-desc__image-wrapper {
        text-align: right;
        margin-top: 2.5rem !important;
    }
}

/* Sam obrazek */
.vc_row.gs-product-desc .gs-product-desc__image {
    width: 100%;
    height: auto;
    display: block;
}

/* Mobile – pod sobą */
@media (max-width: 768px) {
    .vc_row.gs-product-desc {
        grid-template-columns: 1fr;
        column-gap: 0;
        row-gap: 20px;
    }

    .vc_row.gs-product-desc .gs-product-desc__image-wrapper {
        margin-top: 0 !important;
        text-align: left;
    }
}

/* --- CTA na banerach Supro: twardy override --- */

/* Wrapper z pozycją absolutną – żadnego line-height z globalnego :where */
#content .supro-banner-grid.btn-style-2 .banner-content {
  line-height: 1 !important;
}

/* Sam "balon" z tekstem */
#content .supro-banner-grid.btn-style-2 .banner-btn {
  display: flex !important;          /* już NIE inline-block */
  align-items: center !important;    /* pion */
  justify-content: center !important;/* poziom */
  height: 50px !important;           /* jak w motywie */
  line-height: 1 !important;         /* zero dziedziczenia 1.6 */
  padding: 0 30px !important;        /* jak w motywie */
}

.portfolio-masonry .portfolio-wrapper {
  padding: 5px !important;
  display: grid;
  align-items: center;
}

/* InPost / EasyPack – przycisk wyboru punktu */
body.woocommerce-checkout .easypack_show_geowidget{
  background-color: #1e3791 !important;
  border-color: #1e3791 !important;
  color: #ffffff !important;
}

/* Hover / focus */
body.woocommerce-checkout .easypack_show_geowidget:hover,
body.woocommerce-checkout .easypack_show_geowidget:focus{
  filter: brightness(0.92);
  color: #ffffff !important;
}

/* Jeśli to <a> i ma podkreślenie */
body.woocommerce-checkout a.easypack_show_geowidget{
  text-decoration: none !important;
}

/* CHECKOUT – lista metod wysyłki: czytelny układ + ceny + ikonki */
body.woocommerce-checkout ul#shipping_method li,
body.woocommerce-checkout .woocommerce-shipping-methods li{
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 14px;
}

/* radio niech się trzyma góry przy 2 linijkach */
body.woocommerce-checkout ul#shipping_method li input[type="radio"],
body.woocommerce-checkout .woocommerce-shipping-methods li input[type="radio"]{
  margin-top: 4px;
  flex: 0 0 auto;
}

/* label jako flex: nazwa po lewej, cena po prawej */
body.woocommerce-checkout ul#shipping_method li label,
body.woocommerce-checkout .woocommerce-shipping-methods li label{
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  flex-wrap: wrap;      /* jak zabraknie miejsca, niech ładnie zawija */
  column-gap: 10px;
  row-gap: 6px;
}

/* cena zawsze “oddycha” od nazwy i trzyma się jednej linii */
body.woocommerce-checkout ul#shipping_method li label .amount,
body.woocommerce-checkout .woocommerce-shipping-methods li label .amount,
body.woocommerce-checkout ul#shipping_method li label .woocommerce-Price-amount,
body.woocommerce-checkout .woocommerce-shipping-methods li label .woocommerce-Price-amount{
  margin-left: auto;     /* przerzuca cenę na prawo = wyraźna przerwa */
  white-space: nowrap;
  font-weight: 600;
}

/* Ikonki (InPost/Orlen itp.) – niech nie robią “drugiego wiersza” i będą równe */
body.woocommerce-checkout ul#shipping_method li img,
body.woocommerce-checkout .woocommerce-shipping-methods li img{
  display: inline-block !important;
  max-height: 26px;
  width: auto;
  margin: 0;
  flex: 0 0 auto;
}

/* Jeśli InPost obrazek dalej ląduje pod spodem, to zwykle ma display:block.
   Ten killuje ten efekt. */
body.woocommerce-checkout ul#shipping_method li img,
body.woocommerce-checkout .woocommerce-shipping-methods li img{
  vertical-align: middle;
}