/* =========================================
   WooCommerce – Kosár + Pénztár
   Shipping row full-width hack
   ========================================= */

.woocommerce-cart .shop_table tr.woocommerce-shipping-totals.shipping,
.woocommerce-checkout .shop_table tr.woocommerce-shipping-totals.shipping {
    position: relative;
}

.woocommerce-cart .shop_table tr.woocommerce-shipping-totals.shipping > th,
.woocommerce-checkout .shop_table tr.woocommerce-shipping-totals.shipping > th {
    display: none !important;
}

.woocommerce-cart .shop_table tr.woocommerce-shipping-totals.shipping > td,
.woocommerce-checkout .shop_table tr.woocommerce-shipping-totals.shipping > td {
    display: block !important;
    width: 200% !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

.woocommerce-cart .shop_table tr.woocommerce-shipping-totals.shipping > td::before,
.woocommerce-checkout .shop_table tr.woocommerce-shipping-totals.shipping > td::before {
    content: "Szállítás";
    display: block;
    font-weight: 700;
    text-align: left;
    margin: 0 0 14px 0;
    padding: 0;
}

.woocommerce-cart ul#shipping_method,
.woocommerce-checkout ul#shipping_method {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    text-align: left !important;
}

.woocommerce-cart ul#shipping_method li,
.woocommerce-checkout ul#shipping_method li {
    display: grid !important;
    grid-template-columns: 13px minmax(0, 1fr) !important;
    column-gap: 8px !important;
    row-gap: 6px !important;
    align-items: start !important;
    width: 100% !important;
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    text-align: left !important;
}

.woocommerce-cart ul#shipping_method li > input[type="radio"],
.woocommerce-checkout ul#shipping_method li > input[type="radio"] {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 13px !important;
    height: 13px !important;
    min-width: 13px !important;
    min-height: 13px !important;
    margin: 0 0 0 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    float: none !important;
}

.woocommerce-cart ul#shipping_method li > label,
.woocommerce-checkout ul#shipping_method li > label {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: block !important;
    margin: 0 !important;
    width: auto !important;
    float: none !important;
    text-align: left !important;
    line-height: 1.5 !important;
}

.woocommerce-cart ul#shipping_method li > p,
.woocommerce-checkout ul#shipping_method li > p {
    grid-column: 2 !important;
    margin: 0 !important;
    text-align: left !important;
}

.woocommerce-cart .vp-woo-pont-shipping-method-icons,
.woocommerce-checkout .vp-woo-pont-shipping-method-icons {
    display: block !important;
    margin-top: 8px !important;
}

.woocommerce-cart .vp-woo-pont-shipping-method-icons i,
.woocommerce-checkout .vp-woo-pont-shipping-method-icons i {
    display: inline-block !important;
    vertical-align: middle;
    margin-right: 8px;
}

.woocommerce-cart .woocommerce-shipping-destination,
.woocommerce-checkout .woocommerce-shipping-destination {
    margin: 8px 0 0 21px !important;
    text-align: left !important;
}

.woocommerce-cart ul#shipping_method li *,
.woocommerce-checkout ul#shipping_method li * {
    float: none !important;
}

@media (max-width: 767px) {
    .woocommerce-cart .shop_table tr.woocommerce-shipping-totals.shipping > td,
    .woocommerce-checkout .shop_table tr.woocommerce-shipping-totals.shipping > td {
        width: 200% !important;
    }
}

/* =========================================
   WooCommerce – Back In Stock Notifications
   "Értesítést kérek" gomb egységesítése
   ========================================= */

a.js_wc_bis_loop_signup_prompt_trigger_redirect,
a.js_wc_bis_loop_signup_prompt_trigger_unsubscribe {
    display: inline-block !important;
    color: #fff !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    line-height: 2.1875rem !important;
    height: 2.1875rem !important;
    padding-left: 1.125rem !important;
    padding-right: 1.125rem !important;
    text-decoration: none !important;
    border-radius: 2px !important;
}

a.js_wc_bis_loop_signup_prompt_trigger_redirect {
    background-color: #479ac6 !important;
}

a.js_wc_bis_loop_signup_prompt_trigger_unsubscribe {
    background-color: #53616B !important;
}

/* Ikon a szöveg elé (klbtheme "interface" ikonkészlet, ugyanaz a font, amit
   a téma a "Kosárba teszem" gombnál is használ – lásd lentebb). */
a.js_wc_bis_loop_signup_prompt_trigger_redirect::before,
a.js_wc_bis_loop_signup_prompt_trigger_unsubscribe::before {
    font-family: "klbtheme" !important;
    font-style: normal !important;
    font-weight: normal !important;
    speak: never;
    display: inline-block;
    margin-right: 0.4375rem;
    vertical-align: middle;
}

a.js_wc_bis_loop_signup_prompt_trigger_redirect::before {
    content: '\e80b'; /* klb-icon-bell */
}

a.js_wc_bis_loop_signup_prompt_trigger_unsubscribe::before {
    content: '\e80c'; /* klb-icon-bell-slash */
}

/* =========================================
   WooCommerce – "Kosárba teszem" gomb ikonja a szöveg elé kerüljön.
   A téma alapból a szöveg UTÁN renderli a kosár ikont
   (<i class="klb-icon-shopping-cart-extra">), ezért itt csak a
   sorrendet fordítjuk meg flexbox-szal, az ikont magát nem duplikáljuk.
   ========================================= */
.products .product-buttons.cart-with-quantity .add_to_cart_button.ajax_add_to_cart {
    display: inline-flex !important;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: center;
}

div.woocommerce-message a.button.wc-forward {
    background-color: #479ac6 !important;
    color: #fff !important;
}

/* A "Kosárba helyezve" ajax-értesítés (.klb-notice-ajax) "Kosár" linkje a
   blonwe-core notice-ajax.css-ben áttetsző hátterű, aláhúzott szöveglinkként
   van stílusozva (.klb-notice-ajax a.button, padding:0, height:auto,
   text-decoration:underline !important) – ez itt teljesen felülírjuk, hogy
   ugyanúgy nézzen ki, mint a listanézeti "Kosárba teszem" gomb. */
.klb-notice-ajax a.button.wc-forward {
    display: inline-block !important;
    background-color: #479ac6 !important;
    color: #fff !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    line-height: 2.1875rem !important;
    height: 2.1875rem !important;
    padding: 0 1.125rem !important;
    text-decoration: none !important;
    border-radius: 2px !important;
}