/* Gresio — carrello. Vestito della fase restyling; i token sono in style.css (:root). */

/* ==========================================================================
   1. IMPAGINAZIONE — articoli a sinistra, riepilogo appiccicato a destra.
   WooCommerce stampa dentro <div class="woocommerce"> il modulo carrello e
   poi .cart-collaterals: li mettiamo su due colonne con una griglia.
   row-gap: 0 di proposito — le righe implicite create dal riepilogo che
   occupa più righe moltiplicherebbero lo spazio. Le distanze verticali si
   fanno con i margini dei blocchi.
   ========================================================================== */
.woocommerce-cart .entry-header,
.woocommerce-cart .entry-title {
    margin-bottom: 18px;
}

.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper:empty {
    display: none;
}

@media (min-width: 993px) {
    .woocommerce-cart .woocommerce {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 420px;
        column-gap: 40px;
        row-gap: 0;
        align-items: start;
    }

    .woocommerce-cart .woocommerce > * {
        grid-column: 1;
        min-width: 0;
        float: none;
        width: auto;
    }

    .woocommerce-cart .woocommerce > .cart-collaterals {
        grid-column: 2;
        grid-row: 1 / span 20;
        align-self: start;
        position: sticky;
        top: 24px;
        margin: 0;
        padding: 0;
    }

    /* Il cross-sell è largo quanto la pagina: si posiziona da solo sotto la
       colonna del riepilogo perché è l'unico elemento a due colonne. */
    .woocommerce-cart .woocommerce > .gresio-crosssell {
        grid-column: 1 / -1;
    }
}

.woocommerce-cart .woocommerce > .cart-collaterals::before,
.woocommerce-cart .woocommerce > .cart-collaterals::after {
    content: none;
}

/* ==========================================================================
   2. BANNER SCONTO QUANTITÀ
   ========================================================================== */
.gresio-cart-sconto {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 0 0 20px;
    padding: 15px 20px;
    background: var(--gresio-ok-bg);
    color: var(--gresio-ok);
    font-size: 14.5px;
    line-height: 1.5;
}
.gresio-cart-sconto .gcs-segno {
    flex: 0 0 auto;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.4;
}
.gresio-cart-sconto p {
    margin: 0;
}
.gresio-cart-sconto b,
.gresio-cart-sconto strong {
    font-weight: 800;
}
.gresio-cart-sconto .woocommerce-Price-amount {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

/* ==========================================================================
   3. LISTA ARTICOLI — la tabella WooCommerce diventa una pila di schede.
   Niente override di template: si riorganizzano le celle con la griglia,
   così restano intatti quantità, rimozione e AJAX di WooCommerce.
   ========================================================================== */
.woocommerce-cart .woocommerce-cart-form {
    margin: 0 0 22px;
}

.woocommerce-cart table.cart,
.woocommerce-cart table.shop_table.cart {
    display: block;
    margin: 0;
    border: 0;
    background: transparent;
}
.woocommerce-cart table.cart thead {
    display: none;
}
.woocommerce-cart table.cart tbody {
    display: block;
    background: var(--gresio-superficie);
    border: 1px solid var(--gresio-border);
    box-shadow: var(--gresio-ombra-card);
}
.woocommerce-cart table.cart tbody tr {
    display: block;
    background: transparent;
}
.woocommerce-cart table.cart tbody td,
.woocommerce-cart table.cart tbody th {
    display: block;
    border: 0;
    padding: 0;
    background: transparent;
    text-align: left;
}
/* Storefront, sotto i 768px, antepone alle celle il titolo di colonna. */
.woocommerce-cart table.shop_table_responsive tbody tr td::before,
.woocommerce-cart table.cart tbody td::before {
    content: none !important;
    display: none !important;
}

.woocommerce-cart table.cart tbody tr.cart_item {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr) max-content;
    column-gap: 22px;
    row-gap: 8px;
    padding: 26px;
    border-bottom: 1px solid var(--gresio-border);
}
.woocommerce-cart table.cart tbody tr.cart_item:last-child {
    border-bottom: 0;
}
.woocommerce-cart table.cart tbody tr.gresio-riga-campione {
    background: var(--gresio-blue-tint);
}

.woocommerce-cart table.cart td.product-thumbnail {
    grid-column: 1;
    grid-row: 1 / span 3;
}
.woocommerce-cart table.cart td.product-thumbnail img {
    width: 120px;
    height: 120px;
    max-width: none;
    object-fit: cover;
    margin: 0;
}
.woocommerce-cart table.cart td.product-name {
    grid-column: 2;
    grid-row: 1 / span 2;
    font-size: 17px;
    line-height: 1.35;
}
.woocommerce-cart table.cart td.product-name > a {
    display: block;
    font-size: 17px;
    font-weight: 700;
    color: var(--gresio-ink);
    text-decoration: none;
}
.woocommerce-cart table.cart td.product-name > a:hover {
    opacity: 0.82;
}
.gresio-riga-marca {
    display: block;
    margin-bottom: 4px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--gresio-muted);
}
.woocommerce-cart table.cart td.product-name .variation,
.woocommerce-cart table.cart td.product-name dl.variation {
    display: block;
    margin: 6px 0 0;
    font-size: 13.5px;
    line-height: 1.45;
    color: var(--gresio-muted);
}
.woocommerce-cart table.cart td.product-name dl.variation dt,
.woocommerce-cart table.cart td.product-name dl.variation dd {
    display: inline;
    margin: 0;
    font-weight: 400;
}
.woocommerce-cart table.cart td.product-name dl.variation dd p {
    display: inline;
    margin: 0;
}
.woocommerce-cart table.cart td.product-name dl.variation dd::after {
    content: " · ";
}
.woocommerce-cart table.cart td.product-name dl.variation dd:last-child::after {
    content: none;
}
.gresio-riga-modifica {
    display: inline-block;
    margin-top: 8px;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--gresio-blue);
    text-decoration: none;
}
.gresio-riga-modifica:hover {
    opacity: 0.82;
}
.gresio-riga-nota-campione {
    margin: 6px 0 0;
    font-size: 13.5px;
    line-height: 1.45;
    color: var(--gresio-ink-2);
}

.woocommerce-cart table.cart td.product-price {
    grid-column: 3;
    grid-row: 1;
    text-align: right;
    font-size: 13px;
    color: var(--gresio-muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.woocommerce-cart table.cart td.product-price del {
    color: var(--gresio-barrato);
    text-decoration: line-through;
}
.woocommerce-cart table.cart td.product-price ins {
    background: transparent;
    color: var(--gresio-ok);
    font-weight: 700;
    text-decoration: none;
}
.gresio-riga-perc {
    color: var(--gresio-ok);
    font-weight: 700;
}

.woocommerce-cart table.cart td.product-subtotal {
    grid-column: 3;
    grid-row: 2;
    text-align: right;
    font-size: 22px;
    font-weight: 800;
    color: var(--gresio-ink);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.woocommerce-cart table.cart td.product-quantity {
    grid-column: 2;
    grid-row: 3;
    align-self: center;
}
.woocommerce-cart table.cart td.product-quantity .quantity {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--gresio-input-border);
    background: var(--gresio-superficie);
}
.woocommerce-cart table.cart td.product-quantity .quantity input.qty {
    width: 68px;
    padding: 8px 6px;
    border: 0;
    background: transparent;
    font-size: 14.5px;
    font-weight: 700;
    text-align: center;
    color: var(--gresio-ink);
    font-variant-numeric: tabular-nums;
}

.woocommerce-cart table.cart td.product-remove {
    grid-column: 3;
    grid-row: 3;
    align-self: center;
    text-align: right;
}
.woocommerce-cart table.cart td.product-remove a.remove,
.woocommerce-cart a.remove.gresio-riga-rimuovi {
    display: inline-block;
    width: auto;
    height: auto;
    line-height: 1.4;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--gresio-danger);
    background: transparent;
    text-decoration: none;
}
.woocommerce-cart a.remove.gresio-riga-rimuovi:hover {
    background: transparent;
    color: var(--gresio-danger);
    opacity: 0.82;
}

/* Riga azioni (aggiorna carrello). Il campo codice sconto nativo è nascosto:
   quello vero sta nella colonna del riepilogo, accanto al totale. */
.woocommerce-cart table.cart td.actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 12px;
    padding: 18px 26px;
    border-top: 1px solid var(--gresio-border);
    background: var(--gresio-bg);
}
.woocommerce-cart table.cart td.actions .coupon {
    display: none;
}
.woocommerce-cart table.cart td.actions button[name="update_cart"],
.woocommerce-cart table.cart td.actions input[name="update_cart"] {
    padding: 11px 20px;
    border: 1.5px solid var(--gresio-blue-dark);
    background: transparent;
    color: var(--gresio-blue);
    font-size: 14px;
    font-weight: 700;
}
.woocommerce-cart table.cart td.actions button[name="update_cart"]:disabled {
    opacity: 0.45;
}

/* ==========================================================================
   4. IL TUO ORDINE IN CIFRE + BOX AIUTO
   ========================================================================== */
.woocommerce-cart .gresio-cart-figures {
    margin: 0 0 20px;
    padding: 24px 26px;
    background: var(--gresio-superficie);
    border: 1px solid var(--gresio-border);
    box-shadow: var(--gresio-ombra-card);
}
.woocommerce-cart .gresio-cart-figures h2 {
    color: var(--gresio-blue);
    letter-spacing: 0.16em;
    font-weight: 700;
}
.woocommerce-cart .gresio-cart-figures .gcf-grid > div {
    background: var(--gresio-muted-bg);
    border: 0;
}
.woocommerce-cart .gresio-cart-figures dd {
    font-weight: 800;
}

.gresio-cart-aiuto {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin: 0 0 20px;
    padding: 18px 22px;
    background: var(--gresio-superficie);
    border: 1px solid var(--gresio-border);
}
.gresio-cart-aiuto .gca-segno {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: var(--gresio-ink);
    color: var(--gresio-accent);
    font-size: 14px;
    font-weight: 800;
}
.gresio-cart-aiuto p {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: var(--gresio-secondario);
}
.gresio-cart-aiuto strong {
    color: var(--gresio-ink);
}
.gresio-cart-aiuto a {
    font-weight: 700;
    color: var(--gresio-blue);
    text-decoration: none;
    white-space: nowrap;
}
.gresio-cart-aiuto a:hover {
    opacity: 0.82;
}

/* ==========================================================================
   5. COLONNA RIEPILOGO
   ========================================================================== */
.woocommerce-cart .cart-collaterals .cross-sells {
    display: none; /* Il cross-sell è il nostro, in fondo alla pagina. */
}
.woocommerce-cart .cart_totals {
    width: auto;
    float: none;
    margin: 0;
    padding: 26px 28px;
    background: var(--gresio-superficie);
    border: 1px solid var(--gresio-border);
    box-shadow: var(--gresio-ombra-card);
}
.woocommerce-cart .cart_totals h2 {
    margin: 0 0 18px;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: var(--gresio-ink);
}
.woocommerce-cart .cart_totals table,
.woocommerce-cart .cart_totals table.shop_table {
    display: block;
    width: 100%;
    margin: 0;
    border: 0;
    background: transparent;
}
.woocommerce-cart .cart_totals table tbody {
    display: block;
}
.woocommerce-cart .cart_totals table tr {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding: 7px 0;
    border: 0;
    background: transparent;
}
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
    display: block;
    padding: 0;
    border: 0;
    font-size: 14.5px;
    font-weight: 400;
    color: var(--gresio-ink-2);
    background: transparent;
    font-variant-numeric: tabular-nums;
}
.woocommerce-cart .cart_totals table td {
    text-align: right;
}
.woocommerce-cart .cart_totals tr.cart-discount th,
.woocommerce-cart .cart_totals tr.cart-discount td {
    color: var(--gresio-ok);
    font-weight: 700;
}
.woocommerce-cart .cart_totals tr.order-total {
    margin-top: 12px;
    padding-top: 16px;
    border-top: 2px solid var(--gresio-ink);
}
.woocommerce-cart .cart_totals tr.order-total th {
    font-size: 16px;
    font-weight: 800;
    color: var(--gresio-ink);
}
.woocommerce-cart .cart_totals tr.order-total td {
    font-size: 26px;
    font-weight: 800;
    color: var(--gresio-ink);
}
.woocommerce-cart .cart_totals tr.order-total small,
.woocommerce-cart .cart_totals .includes_tax {
    display: block;
    font-size: 12px;
    font-weight: 400;
    color: var(--gresio-muted);
}

/* Riga spedizione: contiene il calcolatore per CAP, quindi va a tutta larghezza. */
.woocommerce-cart .cart_totals tr.woocommerce-shipping-totals,
.woocommerce-cart .cart_totals tr.shipping {
    display: block;
    padding: 12px 0;
    border-top: 1px solid var(--gresio-border);
    border-bottom: 1px solid var(--gresio-border);
}
.woocommerce-cart .cart_totals tr.shipping th {
    margin-bottom: 6px;
    font-weight: 700;
    color: var(--gresio-ink);
}
.woocommerce-cart .cart_totals tr.shipping td {
    text-align: left;
}
.woocommerce-cart .cart_totals ul#shipping_method {
    margin: 0;
    padding: 0;
    list-style: none;
}
.woocommerce-cart .cart_totals ul#shipping_method li {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    margin: 0 0 6px;
    padding: 0;
    font-size: 14.5px;
    color: var(--gresio-ink);
}
.woocommerce-cart .cart_totals ul#shipping_method li label {
    font-weight: 600;
}
.woocommerce-cart .cart_totals .woocommerce-shipping-destination {
    margin: 6px 0 0;
    font-size: 12.5px;
    line-height: 1.45;
    color: var(--gresio-muted);
}
.woocommerce-cart .cart_totals .shipping-calculator-button {
    display: inline-block;
    margin-top: 4px;
    font-size: 13px;
    font-weight: 700;
    color: var(--gresio-blue);
    text-decoration: none;
}
.woocommerce-cart .cart_totals .shipping-calculator-form {
    margin: 10px 0 0;
}
.woocommerce-cart .cart_totals .shipping-calculator-form p {
    margin: 0 0 8px;
}
.woocommerce-cart .cart_totals .shipping-calculator-form input,
.woocommerce-cart .cart_totals .shipping-calculator-form select,
.woocommerce-cart .cart_totals .shipping-calculator-form .select2-selection {
    width: 100%;
    box-sizing: border-box;
    min-width: 0;
    padding: 11px 13px;
    border: 1px solid var(--gresio-input-border);
    background: var(--gresio-bg);
    font-size: 14px;
    color: var(--gresio-ink);
}
.woocommerce-cart .cart_totals .shipping-calculator-form button {
    width: 100%;
    padding: 12px;
    border: 1.5px solid var(--gresio-blue-dark);
    background: transparent;
    color: var(--gresio-blue);
    font-size: 14px;
    font-weight: 700;
}

.woocommerce-cart .wc-proceed-to-checkout {
    padding: 0;
    margin: 20px 0 0;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce-cart .wc-proceed-to-checkout a.button.alt {
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    padding: 17px 20px;
    border: 0;
    background: var(--gresio-ink);
    color: var(--gresio-accent);
    font-size: 16px;
    font-weight: 800;
    text-align: center;
    text-decoration: none;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
    background: var(--gresio-footer);
    color: var(--gresio-accent);
}

/* Chip pagamenti */
.gresio-cart-pagamenti {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    justify-content: center;
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
}
.gresio-cart-pagamenti li {
    margin: 0;
    padding: 4px 9px;
    border: 1px solid var(--gresio-border);
    font-size: 11.5px;
    font-weight: 700;
    color: var(--gresio-ink-2);
}

/* Codice sconto */
.gresio-cart-coupon {
    margin: 20px 0 0;
    padding: 18px 0 0;
    border-top: 1px solid var(--gresio-border);
}
.gresio-cart-coupon .gcc-riga {
    display: flex;
    gap: 10px;
}
.gresio-cart-coupon input[type="text"] {
    flex: 1 1 auto;
    min-width: 0;
    box-sizing: border-box;
    padding: 11px 13px;
    border: 1px solid var(--gresio-input-border);
    background: var(--gresio-bg);
    font-size: 14px;
    color: var(--gresio-ink);
}
.gresio-cart-coupon .gcc-applica {
    flex: 0 0 auto;
    padding: 11px 18px;
    border: 0;
    background: var(--gresio-ink);
    color: var(--gresio-accent);
    font-size: 14px;
    font-weight: 700;
}
.gresio-cart-coupon .gcc-applica:hover {
    background: var(--gresio-footer);
    color: var(--gresio-accent);
}
.gresio-cart-coupon .gcc-nota {
    margin: 12px 0 0;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--gresio-muted);
}

/* Rassicurazioni nella colonna */
.woocommerce-cart .gresio-trust-wrap.is-cart-side {
    margin: 18px 0 0;
    padding-top: 18px;
    border-top: 1px solid var(--gresio-border);
}
.woocommerce-cart .gresio-trust-wrap.is-cart-side .gresio-trust {
    grid-template-columns: 1fr;
    gap: 10px;
}
.woocommerce-cart .gresio-trust-wrap.is-cart-side .gresio-trust li {
    font-size: 13.5px;
}

/* ==========================================================================
   6. CROSS-SELL "TI MANCA QUALCOSA PER LA POSA?"
   Stampato dal plugin (CrossSellPosa) solo se la categoria ha prodotti.
   ========================================================================== */
.gresio-crosssell {
    margin: 40px 0 0;
    padding: 44px 32px;
    background: var(--gresio-muted-bg);
}
.gresio-crosssell-titolo {
    margin: 0 0 26px;
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 800;
    color: var(--gresio-ink);
}
.gresio-crosssell-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 22px;
}
.gresio-crosssell .gcs-card {
    display: block;
    background: var(--gresio-superficie);
    box-shadow: var(--gresio-ombra-card);
    text-decoration: none;
    color: var(--gresio-ink);
}
.gresio-crosssell .gcs-card:hover {
    opacity: 0.9;
}
.gresio-crosssell .gcs-foto img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    margin: 0;
}
.gresio-crosssell .gcs-body {
    display: block;
    padding: 16px 18px 20px;
}
.gresio-crosssell .gcs-nome {
    display: block;
    margin-bottom: 8px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
}
.gresio-crosssell .gcs-prezzo {
    display: block;
    font-size: 20px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}
.gresio-crosssell .gcs-prezzo small {
    font-size: 13px;
    font-weight: 400;
    color: var(--gresio-muted);
}

/* ==========================================================================
   7. CARRELLO VUOTO
   ========================================================================== */
.gresio-cart-empty .gce-kicker {
    display: block;
    margin: 0 0 10px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--gresio-blue);
}
.gresio-cart-empty .gce-card {
    background: var(--gresio-superficie);
    box-shadow: var(--gresio-ombra-card);
}
.gresio-cart-empty .gce-back .button {
    background: var(--gresio-ink);
    color: var(--gresio-accent);
    font-weight: 800;
    padding: 15px 30px;
}

/* ==========================================================================
   8. MOBILE
   ========================================================================== */
@media (max-width: 992px) {
    .woocommerce-cart .cart-collaterals {
        width: auto;
        float: none;
        margin-top: 22px;
    }
}

@media (max-width: 600px) {
    .woocommerce-cart table.cart tbody tr.cart_item {
        grid-template-columns: 76px minmax(0, 1fr) max-content;
        column-gap: 13px;
        padding: 16px;
    }
    .woocommerce-cart table.cart td.product-thumbnail {
        grid-row: 1 / span 4;
    }
    .woocommerce-cart table.cart td.product-thumbnail img {
        width: 76px;
        height: 76px;
    }
    .woocommerce-cart table.cart td.product-name {
        grid-column: 2 / span 2;
        grid-row: 1;
        font-size: 14px;
    }
    .woocommerce-cart table.cart td.product-name > a {
        font-size: 14px;
    }
    .woocommerce-cart table.cart td.product-price {
        grid-column: 2 / span 2;
        grid-row: 2;
        text-align: left;
        white-space: normal;
    }
    .woocommerce-cart table.cart td.product-quantity {
        grid-column: 2;
        grid-row: 3;
    }
    .woocommerce-cart table.cart td.product-quantity .quantity input.qty {
        width: 56px;
        padding: 6px 4px;
    }
    .woocommerce-cart table.cart td.product-subtotal {
        grid-column: 3;
        grid-row: 3;
        align-self: center;
        font-size: 17px;
    }
    .woocommerce-cart table.cart td.product-remove {
        grid-column: 2 / span 2;
        grid-row: 4;
    }
    .woocommerce-cart table.cart td.actions {
        padding: 16px;
    }
    .woocommerce-cart .cart_totals {
        padding: 20px;
    }
    .gresio-crosssell {
        padding: 32px 16px;
    }
}