/* =========================================================
   BIGknot — PEŁNY CSS
   ========================================================= */


/* =========================================================
   1. NAGŁÓWEK
   ========================================================= */

header.wp-block-template-part,
header.wp-block-template-part > div {
    background-color: #ffffff !important;
}

header.wp-block-template-part {
    border-bottom: 1px solid #eeeeee !important;
}


/* =========================================================
   2. MENU
   ========================================================= */

.wp-block-navigation .wp-block-navigation-item a {
    color: #000000 !important;
    transition: color .2s ease !important;
}

.wp-block-navigation-item.current-menu-item > a,
.wp-block-navigation-item.current-menu-ancestor > a,
.wp-block-navigation-item.current-menu-parent > a {
    color: #ff6500 !important;
    font-weight: 600 !important;
}

.wp-block-navigation .wp-block-navigation-item a:hover {
    color: #ff6500 !important;
}


/* =========================================================
   3. PRODUKTY — NAZWA
   ========================================================= */

.wc-block-product .wp-block-post-title,
.wc-block-product .wp-block-post-title a,
.wc-block-product .wc-block-components-product-name,
.wc-block-product .wc-block-components-product-name a,
.wc-block-product-template .wp-block-post-title,
.wc-block-product-template .wp-block-post-title a,
.wc-block-product-template .wc-block-components-product-name,
.wc-block-product-template .wc-block-components-product-name a,
.wp-block-woocommerce-product-template .wp-block-post-title,
.wp-block-woocommerce-product-template .wp-block-post-title a {
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    color: #000000 !important;
}


/* =========================================================
   4. ŚWIECE SOJOWE NAD NAZWĄ
   ========================================================= */

.wc-block-product .wp-block-post-title::before,
.wc-block-product .wc-block-components-product-name::before,
.wc-block-product-template .wp-block-post-title::before,
.wp-block-woocommerce-product-template .wp-block-post-title::before {
    content: "ŚWIECE SOJOWE" !important;
    display: block !important;
    color: #9b9b9b !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    letter-spacing: .3px !important;
    margin-bottom: 7px !important;
}

.wc-block-product .wp-block-post-title,
.wc-block-product .wc-block-components-product-name,
.wc-block-product-template .wp-block-post-title,
.wp-block-woocommerce-product-template .wp-block-post-title {
    margin-top: 8px !important;
    margin-bottom: 7px !important;
}


/* =========================================================
   5. CENA
   ========================================================= */

.wc-block-product .wp-block-woocommerce-product-price,
.wc-block-product .wc-block-components-product-price,
.wc-block-product .wc-block-components-product-price *,
.wc-block-product-template .wp-block-woocommerce-product-price,
.wc-block-product-template .wc-block-components-product-price,
.wc-block-product-template .wc-block-components-product-price *,
.wp-block-woocommerce-product-template .wp-block-woocommerce-product-price,
.wp-block-woocommerce-product-template .wc-block-components-product-price,
.wp-block-woocommerce-product-template .wc-block-components-product-price * {
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    color: #000000 !important;
}


/* =========================================================
   6. DODAJ DO KOSZYKA
   ========================================================= */

.wp-block-button.wc-block-components-product-button .wp-block-button__link,
.wc-block-components-product-button__button,
.wp-block-woocommerce-product-button .wp-block-button__link,
.wc-block-components-product-button a,
.wc-block-components-product-button button,
.wp-block-woocommerce-product-button a,
.wp-block-woocommerce-product-button button {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #000000 !important;
    border-radius: 999px !important;
    padding: 9px 28px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    transition:
        background-color .2s ease,
        color .2s ease !important;
}

.wp-block-button.wc-block-components-product-button .wp-block-button__link:hover,
.wc-block-components-product-button__button:hover,
.wp-block-woocommerce-product-button .wp-block-button__link:hover,
.wc-block-components-product-button a:hover,
.wc-block-components-product-button button:hover {
    background-color: #000000 !important;
    color: #ffffff !important;
}


/* =========================================================
   7. ODSTĘPY PRODUKTÓW
   ========================================================= */

.wc-block-product {
    row-gap: 5px !important;
}

.wc-block-product-template,
.wp-block-woocommerce-product-template {
    row-gap: 40px !important;
}


/* =========================================================
   8. BRAK POWIĘKSZANIA MINIATUR
   ========================================================= */

.wc-block-product img,
.wc-block-product img:hover,
.wc-block-product-template img,
.wc-block-product-template img:hover,
.wp-block-woocommerce-product-template img,
.wp-block-woocommerce-product-template img:hover,
.wc-block-components-product-image img,
.wc-block-components-product-image img:hover {
    transform: none !important;
    scale: 1 !important;
    transition: none !important;
    animation: none !important;
}


/* =========================================================
   9. STRONA PRODUKTU — OKRUSZKI
   ========================================================= */

.woocommerce-breadcrumb,
.wc-block-breadcrumbs,
.wp-block-woocommerce-breadcrumbs,
.woocommerce .woocommerce-breadcrumb {
    display: none !important;
}


/* =========================================================
   10. STRONA PRODUKTU — LUPA
   ========================================================= */

.woocommerce-product-gallery__trigger,
.woocommerce-product-gallery__trigger img,
.woocommerce-product-gallery a.woocommerce-product-gallery__trigger {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}


/* =========================================================
   11. STRONA PRODUKTU — ZOOM
   ========================================================= */

.single-product .woocommerce-product-gallery__image,
.single-product .woocommerce-product-gallery__image:hover,
.single-product .woocommerce-product-gallery__image img,
.single-product .woocommerce-product-gallery__image:hover img,
.single-product .woocommerce-product-gallery__wrapper img,
.single-product .woocommerce-product-gallery__wrapper img:hover,
.single-product .wp-block-woocommerce-product-image-gallery img,
.single-product .wp-block-woocommerce-product-image-gallery img:hover {
    transform: none !important;
    scale: 1 !important;
    transition: none !important;
    animation: none !important;
}

.single-product img.zoomImg,
.single-product .zoomImg,
.woocommerce-product-gallery img.zoomImg {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}


/* =========================================================
   12. ŚWIECE SOJOWE NAD TYTUŁEM PRODUKTU
   ========================================================= */

.single-product .wp-block-post-title::before,
.single-product .product_title::before,
.single-product h1.wp-block-post-title::before,
.single-product h1.product_title::before {
    content: "ŚWIECE SOJOWE" !important;
    display: block !important;
    color: #9b9b9b !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    letter-spacing: .5px !important;
    margin-bottom: 10px !important;
}


/* =========================================================
   13. USUŃ OPINIE
   ========================================================= */

.single-product .woocommerce-tabs,
.single-product .wc-tabs-wrapper,
.single-product .woocommerce-Tabs-panel,
.single-product .woocommerce-Reviews,
.single-product #reviews,
.single-product .reviews_tab,
.single-product a[href="#tab-reviews"] {
    display: none !important;
}


/* =========================================================
   14. STOPKA
   ========================================================= */

footer.wp-block-template-part,
footer.wp-block-template-part > div {
    background-color: #ffffff !important;
}


/* =========================================================
   15. NEWSLETTER
   ========================================================= */

.bigknot-newsletter {
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 60px 20px 70px !important;
    box-sizing: border-box !important;
    background-color: #000000 !important;
    color: #ffffff !important;
    text-align: center !important;
}

.bigknot-newsletter h1,
.bigknot-newsletter h2,
.bigknot-newsletter h3 {
    display: block !important;
    width: 100% !important;
    max-width: 900px !important;
    margin: 0 auto 12px auto !important;
    padding: 0 !important;
    color: #ffffff !important;
    font-size: 26px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: 5px !important;
    text-align: center !important;
}

.bigknot-newsletter > p {
    display: block !important;
    width: 100% !important;
    max-width: 900px !important;
    margin: 0 auto 30px auto !important;
    padding: 0 !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    text-align: center !important;
}


/* =========================================================
   16. FLUENT FORMS
   ========================================================= */

.bigknot-newsletter .fluentform,
.bigknot-newsletter .fluentform_wrapper_3 {
    display: block !important;
    width: 100% !important;
    max-width: 700px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    background: transparent !important;
}

.bigknot-newsletter #fluentform_3 {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    max-width: 700px !important;
    min-height: 50px !important;
    margin: 0 auto !important;
    padding: 0 165px 0 0 !important;
    box-sizing: border-box !important;
    background: transparent !important;
    overflow: visible !important;
}

.bigknot-newsletter #fluentform_3 .ff-el-group,
.bigknot-newsletter #fluentform_3 .ff-el-input--content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

.bigknot-newsletter #fluentform_3 .ff-el-input--label {
    display: none !important;
}


/* =========================================================
   17. NEWSLETTER — EMAIL
   ========================================================= */

.bigknot-newsletter #fluentform_3 input[type="email"],
.bigknot-newsletter #fluentform_3 input[name*="email"] {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    margin: 0 !important;
    padding: 0 22px !important;
    box-sizing: border-box !important;
    background-color: #ffffff !important;
    color: #111111 !important;
    border: 0 !important;
    border-radius: 999px !important;
    outline: none !important;
    box-shadow: none !important;
    font-family: inherit !important;
    font-size: 14px !important;
}

.bigknot-newsletter #fluentform_3 input[type="email"]::placeholder,
.bigknot-newsletter #fluentform_3 input[name*="email"]::placeholder {
    color: #929292 !important;
    opacity: 1 !important;
}


/* =========================================================
   18. NEWSLETTER — PRZYCISK
   ========================================================= */

.bigknot-newsletter #fluentform_3 .ff_submit_btn_wrapper {
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 153px !important;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.bigknot-newsletter #fluentform_3 .ff-btn-submit,
.bigknot-newsletter #fluentform_3 button[type="submit"],
.bigknot-newsletter #fluentform_3 input[type="submit"] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 153px !important;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 20px !important;
    background-color: #ff6500 !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
}

.bigknot-newsletter #fluentform_3 .ff-btn-submit:hover,
.bigknot-newsletter #fluentform_3 button[type="submit"]:hover {
    background-color: #ff7a00 !important;
}


/* =========================================================
   19. NEWSLETTER — MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .bigknot-newsletter {
        padding: 48px 18px 55px !important;
    }

    .bigknot-newsletter h1,
    .bigknot-newsletter h2,
    .bigknot-newsletter h3 {
        font-size: 20px !important;
        letter-spacing: 3px !important;
    }

    .bigknot-newsletter > p {
        font-size: 14px !important;
        margin-bottom: 25px !important;
    }

    .bigknot-newsletter #fluentform_3 {
        width: 100% !important;
        max-width: 420px !important;
        padding: 0 !important;
    }

    .bigknot-newsletter #fluentform_3 input[type="email"],
    .bigknot-newsletter #fluentform_3 input[name*="email"] {
        height: 52px !important;
    }

    .bigknot-newsletter #fluentform_3 .ff_submit_btn_wrapper {
        position: static !important;
        width: 100% !important;
        height: 52px !important;
        margin-top: 10px !important;
    }

    .bigknot-newsletter #fluentform_3 .ff-btn-submit,
    .bigknot-newsletter #fluentform_3 button[type="submit"],
    .bigknot-newsletter #fluentform_3 input[type="submit"] {
        width: 100% !important;
        height: 52px !important;
    }
}


/* =========================================================
   20. CHECKOUT — NAZWA PRODUKTU ZOSTAJE
   ========================================================= */

.wc-block-checkout .wc-block-components-order-summary-item__description,
.wc-block-components-order-summary .wc-block-components-order-summary-item__description,
.wc-block-components-order-summary-item__description {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.wc-block-checkout .wc-block-components-product-name,
.wc-block-components-order-summary .wc-block-components-product-name,
.wc-block-components-order-summary-item__description .wc-block-components-product-name,
.wc-block-components-order-summary-item__description a.wc-block-components-product-name {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin: 0 0 4px 0 !important;
    padding: 0 !important;
    color: #111111 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    text-decoration: none !important;
}


/* =========================================================
   21. CHECKOUT — UKRYJ OPIS PRODUKTU
   ========================================================= */

.wc-block-checkout
.wc-block-components-order-summary-item__description > p,

.wc-block-components-order-summary
.wc-block-components-order-summary-item__description > p,

.wc-block-components-order-summary-item__description > p {
    display: none !important;
}

.wc-block-checkout .wc-block-components-product-metadata,
.wc-block-checkout .wc-block-components-product-details,
.wc-block-components-order-summary .wc-block-components-product-metadata,
.wc-block-components-order-summary .wc-block-components-product-details,
.wc-block-components-product-metadata,
.wc-block-components-product-details {
    display: none !important;
}


/* =========================================================
   22. CHECKOUT — ZDJĘCIE, ILOŚĆ I CENA
   ========================================================= */

.wc-block-components-order-summary-item__image,
.wc-block-components-order-summary-item__image img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.wc-block-components-order-summary-item__quantity {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.wc-block-components-order-summary-item__total-price {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}


/* =========================================================
   23. KLASYCZNY CHECKOUT
   ========================================================= */

.woocommerce-checkout-review-order-table .product-name {
    display: table-cell !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.woocommerce-checkout-review-order-table .product-name > a {
    display: inline !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.woocommerce-checkout-review-order-table .product-name .variation,
.woocommerce-checkout-review-order-table .product-name dl,
.woocommerce-checkout-review-order-table .product-name p,
.woocommerce-checkout-review-order-table .product-name small {
    display: none !important;
}


/* =========================================================
   24. CHECKOUT — MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .wc-block-checkout .wc-block-components-product-name,
    .wc-block-components-order-summary .wc-block-components-product-name,
    .wc-block-components-order-summary-item__description .wc-block-components-product-name {
        font-size: 14px !important;
        line-height: 1.3 !important;
    }
}


/* =========================================================
   25. BOCZNY KOSZYK — UKRYJ INFORMACJĘ O WYSYŁCE
   ========================================================= */

/*
   Usuwa tekst:
   "Wysyłka zostanie obliczona podczas realizacji
   transakcji (checkout)"
*/

.wc-block-mini-cart__footer
.wc-block-components-totals-item__description,

.wc-block-mini-cart__footer
.wc-block-components-totals-shipping__via,

.wc-block-mini-cart__footer
.wc-block-components-shipping-address,

.wc-block-mini-cart__footer
.wc-block-components-totals-shipping {
    display: none !important;
}
/* =========================================================
   BIGKNOT — DUŻA SEKCJA PRODUKTÓW / 4 W RZĘDZIE
   ========================================================= */


/* ===== WYRYWAMY SIATKĘ Z WĄSKIEGO KONTENERA ===== */

body .wc-block-product-template,
body .wp-block-woocommerce-product-template {

    display: grid !important;

    grid-template-columns: repeat(4, 260px) !important;

    column-gap: 35px !important;
    row-gap: 65px !important;

    width: 1145px !important;
    max-width: none !important;

    position: relative !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* ===== POJEDYNCZY PRODUKT ===== */

body .wc-block-product-template > .wc-block-product,
body .wp-block-woocommerce-product-template > .wc-block-product {

    width: 260px !important;
    max-width: 260px !important;
    min-width: 260px !important;

    margin: 0 !important;
    padding: 0 !important;

    box-sizing: border-box !important;
}


/* ===== DUŻE ZDJĘCIE ===== */

body .wc-block-product .wc-block-components-product-image,
body .wc-block-product .wp-block-woocommerce-product-image {

    width: 260px !important;
    max-width: 260px !important;

    height: 260px !important;

    margin: 0 auto 14px auto !important;

    overflow: visible !important;
}


/* ===== SAM OBRAZEK ===== */

body .wc-block-product .wc-block-components-product-image img,
body .wc-block-product .wp-block-woocommerce-product-image img {

    display: block !important;

    width: 260px !important;
    max-width: 260px !important;

    height: 260px !important;
    max-height: 260px !important;

    object-fit: contain !important;

    margin: 0 auto !important;

    transform: none !important;
}


/* ===== ŚWIECE SOJOWE ===== */

body .wc-block-product .wp-block-post-title::before,
body .wc-block-product .wc-block-components-product-name::before {

    font-size: 12px !important;

    margin-bottom: 7px !important;
}


/* ===== NAZWA PRODUKTU ===== */

body .wc-block-product .wp-block-post-title,
body .wc-block-product .wp-block-post-title a,
body .wc-block-product .wc-block-components-product-name,
body .wc-block-product .wc-block-components-product-name a {

    font-size: 16px !important;
    line-height: 1.25 !important;

    min-height: 40px !important;

    margin-bottom: 5px !important;
}


/* ===== CENA ===== */

body .wc-block-product .wp-block-woocommerce-product-price,
body .wc-block-product .wc-block-components-product-price,
body .wc-block-product .wc-block-components-product-price * {

    font-size: 16px !important;
    font-weight: 700 !important;

    min-height: 25px !important;

    margin-bottom: 12px !important;
}


/* =========================================================
   PRZYCISK DODAJ DO KOSZYKA
   ========================================================= */


/* Kontener przycisku */

body .wc-block-product .wc-block-components-product-button,
body .wc-block-product .wp-block-woocommerce-product-button,
body .wc-block-product .wp-block-button {

    width: 100% !important;

    display: flex !important;
    justify-content: center !important;

    margin: 0 !important;
}


/* Sam przycisk */

body .wc-block-product
.wc-block-components-product-button a,

body .wc-block-product
.wc-block-components-product-button button,

body .wc-block-product
.wp-block-woocommerce-product-button a,

body .wc-block-product
.wp-block-woocommerce-product-button button,

body .wc-block-product
.wp-block-button__link {

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 190px !important;
    min-width: 190px !important;
    max-width: 190px !important;

    height: 50px !important;
    min-height: 50px !important;

    padding: 0 15px !important;

    box-sizing: border-box !important;

    font-size: 14px !important;
    font-weight: 500 !important;

    line-height: 1 !important;

    white-space: nowrap !important;

    background: #ffffff !important;
    color: #000000 !important;

    border: 1px solid #000000 !important;
    border-radius: 999px !important;

    text-align: center !important;

    box-shadow: none !important;
}


/* HOVER */

body .wc-block-product
.wc-block-components-product-button a:hover,

body .wc-block-product
.wc-block-components-product-button button:hover,

body .wc-block-product
.wp-block-woocommerce-product-button a:hover,

body .wc-block-product
.wp-block-woocommerce-product-button button:hover,

body .wc-block-product
.wp-block-button__link:hover {

    background: #000000 !important;
    color: #ffffff !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1000px) {

    body .wc-block-product-template,
    body .wp-block-woocommerce-product-template {

        grid-template-columns: repeat(2, 260px) !important;

        width: 555px !important;
    }
}


/* =========================================================
   TELEFON
   ========================================================= */

@media (max-width: 600px) {

    body .wc-block-product-template,
    body .wp-block-woocommerce-product-template {

        grid-template-columns: 260px !important;

        width: 260px !important;
    }
}