/* ==========================================
   1. GŁÓWNY UKŁAD KOSZYKA (FLEXBOX)
   ========================================== */
div.woocommerce {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
}

div.woocommerce > .woocommerce-notices-wrapper {
    width: 100% !important;
    flex: 0 0 100% !important;
    margin-bottom: 2em;
}

div.woocommerce > form.woocommerce-cart-form {
    width: 65% !important;
    flex: 0 0 65% !important;
    box-sizing: border-box !important;
    background: white;
    padding: 2em;
    border-radius: 1em;
    box-shadow: 0 0.5em 2em rgb(0 0 0 / 10%);
    margin: 0 !important;
}

div.woocommerce > .cart-collaterals {
    width: 32% !important;
    flex: 0 0 32% !important;
    box-sizing: border-box !important;
    position: sticky !important;
    top: 30px !important;
    background: white;
    padding: 2em;
    border-radius: 1em;
    box-shadow: 0em 0.5em 2em 0em rgb(0 0 0 / 10%);
    margin-top: 0 !important;
}

/* Ukrycie Cross-sells wypluwanych w prawej kolumnie (żeby nie psuły szerokości) */
div.woocommerce > .cart-collaterals > .cross-sells {
    display: none !important;
}

/* ==========================================
   2. WIZUALIA LEWEJ KOLUMNY
   ========================================== */
table.shop_table.shop_table_responsive.cart.woocommerce-cart-form__contents {
    font-size: 12px;
    line-height: 1.7;
    text-transform: uppercase !important;
    font-weight: 500;
    color: #4a4a4a;
    margin-bottom: 0.1em;
}

div.woocommerce .cart .actions .coupon > input[type=text] {
    width: 100%;	
    max-width: none;
    margin-bottom: 0px;
}
input#coupon_code {
    height: 40px;
    margin-right: 2em;
}

/* ==========================================
   3. PRAWA KOLUMNA - PODSUMOWANIE (PANCERNE)
   ========================================== */
.woocommerce .cart-collaterals .cart_totals {
    width: 100% !important;
    margin: 0 !important;
}

.woocommerce .cart-collaterals .cart_totals h2 {
    display: none !important;
}

/* Wymuszamy układ blokowy dla tabeli */
.woocommerce .cart-collaterals .cart_totals table.shop_table,
.woocommerce .cart-collaterals .cart_totals table.shop_table tbody {
    display: block !important;
    width: 100% !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Każdy wiersz to flexbox rozpychający elementy na boki */
.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    padding: 15px 0 !important;
    border-bottom: 1px solid #eaeaea !important;
    margin: 0 !important;
}

.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr:last-child {
    border-bottom: none !important;
}

/* Nagłówki (Wartość, Dostawa) - sztywne 40% szerokości, do lewej */
.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr th {
    width: 40% !important;
    text-align: left !important;
    padding: 0 !important;
    border: none !important;
    color: #4a4a4a !important; /* Nadpisuje niebieski z motywu */
    font-weight: 600 !important;
    text-transform: uppercase !important;
}

/* Wartości (Kwoty) - sztywne 60% szerokości, do prawej */
.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr td {
    width: 60% !important;
    text-align: right !important;
    padding: 0 !important;
    border: none !important;
}

/* Wyłączenie transformacji tekstu dla kwot i dostaw */
.woocommerce .cart-collaterals .cart_totals td *,
.woocommerce .cart-collaterals .cart_totals th * {
    text-transform: none !important;
}

/* Wartość produktów (Subtotal) - ZWIĘKSZONA KWOTA */
.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr.cart-subtotal td .amount {
    font-size: 1.5em !important;
    font-weight: 700 !important;
    color: #111 !important;
}

/* --- DOSTAWA --- */
.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr.woocommerce-shipping-totals {
    flex-direction: column !important;
    align-items: flex-start !important;
}

.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr.woocommerce-shipping-totals th {
    width: 100% !important;
    margin-bottom: 15px !important;
    text-align: left !important;
}

.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr.woocommerce-shipping-totals td {
    width: 100% !important;
    text-align: left !important;
}

/* Metody dostawy - lista z kreskami */
.woocommerce .cart-collaterals .cart_totals #shipping_method {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

.woocommerce .cart-collaterals .cart_totals #shipping_method li {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    padding: 12px 0 !important;
    margin: 0 !important;
    border-top: 1px solid #eaeaea !important;
    list-style: none !important;
    text-align: left !important;
}

.woocommerce .cart-collaterals .cart_totals #shipping_method li:first-child {
    border-top: none !important;
}

.woocommerce .cart-collaterals .cart_totals #shipping_method li input {
    margin: 0 10px 0 0 !important;
}

.woocommerce .cart-collaterals .cart_totals #shipping_method li label {
    margin: 0 !important;
    color: #4a4a4a !important;
    font-size: 13px !important;
}

/* Ukrycie tekstu "Metody wysyłki zostaną..." */
.woocommerce .cart-collaterals .cart_totals .woocommerce-shipping-destination {
    display: none !important;
}

/* --- RABATY --- */
.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr.cart-discount th,
.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr.cart-discount td,
.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr.cart-discount td .amount,
.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr.fee td .amount {
    color: #e50000 !important;
    font-size: 1.3em !important;
    font-weight: 700 !important;
}

/* --- FINALNA CENA ZAKUPU --- */
.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr.order-total {
    background: #e6efff !important;
    padding: 20px !important;
    border-radius: 8px !important;
    margin-top: 15px !important;
    display: flex !important;
    align-items: center !important;
}

.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr.order-total th {
    color: #0056b3 !important;
    font-size: 1.2em !important;
}

.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr.order-total td {
    font-size: 1.6em !important;
    font-weight: 700 !important;
    color: #000 !important;
}

.woocommerce .cart-collaterals .cart_totals table.shop_table tbody tr.order-total td small.includes_tax {
    display: block !important;
    font-size: 12px !important;
    font-weight: normal !important;
    color: #555 !important;
    margin-top: 5px !important;
}

/* Przycisk kasy */
.woocommerce .cart-collaterals .wc-proceed-to-checkout a.checkout-button {
    width: 100% !important;
    color: #fff !important;
    border: none !important;
    box-shadow: rgba(0, 0, 0, 0.28) 0px 2px 8px 0px !important;
    padding: 1.5em !important;
    margin-top: 1.5em !important;
    text-transform: uppercase !important;
    font-size: 1em !important;
    text-align: center !important;
    display: block !important;
    border-radius: 4px !important;
}

/* ==========================================
   4. DETALE, ALERT STYLES, POLA FORMULARZA
   ========================================== */
textarea:focus, input[type=text]:focus, input[type=password]:focus, input[type=datetime]:focus, input[type=datetime-local]:focus, input[type=date]:focus, input[type=month]:focus, input[type=time]:focus, input[type=week]:focus, input[type=number]:focus, input[type=email]:focus, input[type=url]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=color]:focus, .uneditable-input:focus {
    border-color: #4e22e9;
    box-shadow: none;
    outline: 0;
}

.woocommerce-error {
    background-color: #ff7e7e;
    border: none;
    color: #761f1f;
}
.woocommerce-error, .woocommerce-info, .woocommerce-message {
    text-shadow: none;
}

/* ==========================================
   5. CROSS-SELLS (ZOBACZ INNE) - NAPRAWA OCEANWP
   ========================================== */
div.woocommerce .cross-sells ul.products.oceanwp-row {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 15px !important;
    margin: 0 !important;
}

div.woocommerce .cross-sells ul.products li.product.col.span_1_of_4,
div.woocommerce .cross-sells ul.products li.product.col.span_1_of_2 {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 15px !important;
    box-sizing: border-box !important;
    border: 1px solid #eaeaea !important;
    border-radius: 8px !important;
    display: flex !important;
    flex-direction: column !important;
}

div.woocommerce .cross-sells ul.products li.product .product-inner,
div.woocommerce .cross-sells ul.products li.product .woo-entry-inner {
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
}

div.woocommerce .cross-sells ul.products li.product > .product-inner > .woo-entry-image {
    display: none !important;
}

div.woocommerce .cross-sells ul.products li.product .woo-entry-inner h2,
div.woocommerce .cross-sells ul.products li.product .woo-entry-inner h2 a {
    font-size: 13px !important;
    line-height: 1.4 !important;
    margin: 10px 0 !important;
    text-align: center !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    overflow: visible !important;
    height: auto !important;
    display: block !important;
}

div.woocommerce .cross-sells ul.products li.product .woo-entry-inner .price-wrap {
    margin-top: auto !important;
    text-align: center !important;
}

div.woocommerce .cross-sells ul.products li.product .woo-entry-inner .price {
    font-size: 15px !important;
    font-weight: 600 !important;
    margin-bottom: 15px !important;
    display: block !important;
}

div.woocommerce .cross-sells ul.products li.product .woo-entry-inner .btn-wrap {
    width: 100% !important;
    margin: 0 !important;
}

div.woocommerce .cross-sells ul.products li.product .woo-entry-inner .button {
    width: 100% !important;
    padding: 8px !important;
    font-size: 12px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

div.woocommerce .cross-sells ul.products li.product .br_compare_button {
    display: none !important;
}

/* ==========================================
   6. RESPONSIVE (TELEFONY I TABLETY)
   ========================================== */
@media (max-width: 1024px) {
    div.woocommerce .cross-sells ul.products.oceanwp-row {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

@media (max-width: 992px) {
    div.woocommerce {
        flex-direction: column !important;
    }
    div.woocommerce > form.woocommerce-cart-form,
    div.woocommerce > .cart-collaterals {
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
        position: static !important;
        margin-top: 0 !important;
    }
    div.woocommerce > .cart-collaterals {
        margin-top: 2em !important;
    }
}

@media (max-width: 768px) {
    div.woocommerce .cross-sells ul.products.oceanwp-row {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 480px) {
    div.woocommerce .cross-sells ul.products.oceanwp-row {
        grid-template-columns: 1fr !important;
    }
}