/* Cart V1 — palette and typography shared with the homepage and product page. */ [hidden]{display:none!important} .cart-breadcrumb{display:flex;align-items:center;gap:12px;padding:20px 0;color:var(--muted);font-size:13px}.cart-breadcrumb a{display:flex;align-items:center;min-height:32px}.cart-breadcrumb [aria-current]{color:var(--blue)} .cart-heading{display:flex;align-items:center;justify-content:space-between;gap:32px;margin:12px 0 36px}.cart-heading .eyebrow{margin-bottom:8px}.cart-heading h1{font-size:58px;margin:0;display:flex;align-items:center;gap:20px}.heading-count{font:600 16px var(--font);display:grid;place-items:center;min-width:32px;height:32px;padding:0 8px;letter-spacing:0;border:1px solid var(--line);border-radius:50%;background:var(--cream)}.continue-link{display:flex;align-items:center;gap:10px;min-height:44px;color:var(--blue);font-size:15px}.continue-link svg{transform:rotate(180deg);width:18px}.continue-link:hover{text-decoration:underline;text-underline-offset:4px} .cart-shipping-card{display:none}.cart-layout{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:64px;align-items:start}.cart-products{min-width:0}.cart-columns{display:grid;grid-template-columns:1fr 132px 106px;gap:28px;padding:15px 0;border-block:1px solid var(--line);color:var(--muted);font-size:13px}.cart-columns span:last-child{text-align:right}.cart-columns span:nth-child(2){text-align:center} .line-item{display:grid;grid-template-columns:126px minmax(0,1fr) 132px 106px;gap:22px 28px;padding:28px 0;border-bottom:1px solid var(--line);align-items:center}.line-photo{display:flex;align-items:center;justify-content:center;width:126px;height:144px;background:var(--cream);border:1px solid var(--line);border-radius:3px;overflow:hidden}.line-photo img{width:100%;height:100%;object-fit:contain;mix-blend-mode: normal;transform:scale(1.35)}.line-photo.cups img{transform:scale(1.05)}.line-name{min-width:0}.line-brand{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}.line-name h3{font:500 25px/1.2 var(--display);letter-spacing:-.035em;color:var(--blue);margin-bottom:7px}.line-name h3 a:hover{text-decoration:underline;text-underline-offset:4px}.line-format{font-size:14px;color:var(--muted);line-height:1.5}.line-unit{font-size:13px;color:var(--muted);margin-top:9px}.line-unit strong{font-weight:600;color:var(--blue)}.line-quantity{align-self:center}.quantity-control{display:flex;width:132px;border:1px solid var(--line);border-radius:3px;overflow:hidden;background:#fff}.quantity-control button{width:44px;height:44px;background:var(--cream);border:0;color:var(--blue);display:grid;place-items:center;flex-shrink:0}@media(hover:hover){.quantity-control button:hover:not(:disabled){background:var(--line)}}.quantity-control button:disabled{opacity:.4;cursor:default}.quantity-control svg{width:17px;height:17px}.quantity-control input{width:42px;min-width:0;border:0;border-inline:1px solid var(--line);padding:8px 0;text-align:center;color:var(--blue);font-size:17px;font-weight:600;appearance:textfield;-moz-appearance:textfield}.quantity-control input::-webkit-inner-spin-button,.quantity-control input::-webkit-outer-spin-button{appearance:none;margin:0}.quantity-error{font-size:12px;color:var(--blue-dark);margin-top:8px}.quantity-control:has([aria-invalid="true"]){outline:2px solid var(--blue)}.line-price{text-align:right;align-self:center;color:var(--blue);font-size:20px;font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}.remove-item{display:flex;align-items:center;justify-content:center;gap:5px;background:none;border:0;min-height:44px;width:100%;color:var(--muted);font-size:13px;margin-top:6px;padding:0}.remove-item:hover{color:var(--blue);text-decoration:underline}.remove-item svg{width:13px;height:13px}.quantity-hint{font-size:13px;color:var(--muted);margin-top:16px} .order-aside{position:sticky;top:24px;min-width:0}.order-summary{background:var(--cream);border:1px solid var(--line);border-radius:3px;padding:30px}.order-summary>.eyebrow{font-size:11px;margin-bottom:8px}.order-summary h2{font-size:32px}.shipping-progress{padding:24px 0 20px;margin:0 0 20px;border-bottom:1px solid var(--line)}.shipping-message{display:flex;align-items:center;gap:12px;color:var(--blue)}.shipping-message svg{width:24px;height:24px}.shipping-message p{font-size:15px;line-height:1.4}.shipping-message strong{font-weight:600}.shipping-track{height:4px;background:var(--line);margin:14px 0 8px;overflow:hidden;border-radius:4px}.shipping-track>span{display:block;height:100%;background:var(--gold);transition:width .2s ease}.shipping-threshold{color:var(--muted);font-size:12px}.order-totals{margin:0}.order-totals>div{display:flex;justify-content:space-between;gap:12px;align-items:baseline;font-size:16px;margin-bottom:16px}.order-totals dt{color:var(--muted)}.order-totals dt>span{display:block;font-size:12px;margin-top:1px}.order-totals dd{margin:0;color:var(--blue);font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}.order-totals .grand-total{border-top:1px solid var(--line);padding-top:20px;margin-top:20px;margin-bottom:16px}.grand-total dt{font-weight:600;color:var(--blue);font-size:19px}.grand-total dd{font-size:30px;letter-spacing:-.03em}.delivery-estimate{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--blue);margin-bottom:18px}.delivery-estimate svg{width:19px;height:19px}.checkout-button{width:100%;gap:20px;font-size:17px;min-height:56px}.checkout-button:disabled{opacity:.5;cursor:not-allowed}.checkout-note{text-align:center;font-size:12px;color:var(--muted);margin-top:10px}.coupon{border-top:1px solid var(--line);margin-top:24px;padding-top:6px}.coupon summary{display:flex;align-items:center;justify-content:space-between;gap:8px;list-style:none;cursor:pointer;min-height:48px;font-size:14px;color:var(--muted)}.coupon summary::-webkit-details-marker{display:none}.coupon summary svg{width:17px;height:17px;color:var(--blue)}.coupon[open] summary svg{transform:rotate(45deg)}.coupon label{display:block;font-size:13px;color:var(--blue);margin-bottom:6px}.coupon-fields{display:flex;gap:8px}.coupon input{min-width:0;width:100%;background:#fff;border:1px solid var(--line);border-radius:3px;padding:9px;font-size:16px}.coupon-fields button{min-height:44px;padding:8px 12px;background:#fff;border:1px solid var(--blue);border-radius:3px;color:var(--blue);font-size:14px}.coupon #coupon-message{font-size:13px;color:var(--blue-dark);margin-top:8px;line-height:1.4}.order-assurance{display:flex;align-items:flex-start;gap:9px;padding:16px 8px;font-size:12px;color:var(--muted)}.order-assurance svg{width:18px;height:18px;color:var(--blue)} .undo-notice #undo-remove{min-height:44px;background:none;border:0;padding:8px;font-size:14px;color:var(--blue);text-decoration:underline;text-underline-offset:4px}.undo-notice .icon-button{width:44px;height:44px}.undo-notice .icon-button svg{width:18px} .cart-extras{border-top:1px solid var(--line);margin-top:64px;padding:42px 0 60px;display:grid;grid-template-columns:280px 1fr;gap:50px;align-items:start}.extras-heading .eyebrow{font-size:10px;margin-bottom:10px}.extras-heading h2{font-size:34px;line-height:1.1;margin-bottom:14px}.extras-heading>p:last-child{font-size:15px;color:var(--muted);max-width:230px}.extras-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.extra-card{display:flex;align-items:center;gap:20px;min-width:0}.extra-photo{width:132px;height:164px;display:flex;align-items:center;justify-content:center;background:var(--cream);border:1px solid var(--line);border-radius:3px;overflow:hidden;flex-shrink:0}.extra-photo img{width:100%;height:100%;object-fit:contain;mix-blend-mode: normal;transform:scale(1.3)}.cups-photo img{transform:scale(1.05)}.extra-info{flex:1;min-width:0}.extra-system{color:var(--blue);font-size:11px;margin-bottom:5px}.extra-info h3{font:500 23px/1.2 var(--display);letter-spacing:-.03em;color:var(--blue);margin-bottom:7px}.extra-info>p:not(.extra-system){font-size:13px;color:var(--muted);line-height:1.45}.extra-info>strong{display:block;color:var(--blue);font-size:18px;margin-top:10px;font-weight:600}.extra-add{display:flex;justify-content:space-between;align-items:center;gap:12px;background:none;border:0;border-bottom:1px solid var(--blue);color:var(--blue);min-height:44px;width:100%;font-size:14px;font-weight:600;padding:8px 0}.extra-add svg{width:17px;height:17px}@media(hover:hover){.extra-add:hover{background:var(--cream)}} #empty-cart{text-align:center;background:var(--cream);border:1px solid var(--line);padding:48px 24px}.empty-illustration{width:82px;height:82px;position:relative;margin:0 auto 24px;border-radius:50%;background:#fff;color:var(--blue);display:grid;place-items:center}.empty-illustration>svg{width:40px;height:40px;stroke-width:1.1}.empty-illustration>span{position:absolute;right:9px;bottom:10px;background:var(--cream);border:1px solid var(--line);border-radius:50%;width:24px;height:24px;font-size:12px;display:grid;place-items:center}.empty-illustration~.eyebrow{margin-bottom:12px}#empty-cart h2{font-size:48px;margin-bottom:20px}#empty-cart>p:not(.eyebrow){color:var(--muted);font-size:17px;line-height:1.6;margin-bottom:24px}.empty-categories{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 28px;margin-top:20px}.empty-categories a{font-size:14px;color:var(--blue);min-height:44px;display:flex;align-items:center;text-decoration:underline;text-underline-offset:4px}.mobile-checkout{display:none}.preview-label{font-size:9px}.preview-total{display:flex;align-items:center;justify-content:space-between;gap:16px;color:var(--blue);margin:24px 0;font-size:17px}.preview-total strong{font-size:26px}#checkout-preview>p{color:var(--muted);font-size:16px}#checkout-preview .button{width:100%}footer{border-top:1px solid var(--line)} @media(max-width:1200px){.cart-layout{grid-template-columns:minmax(0,1fr) 350px;gap:36px}.order-summary{padding:24px}.line-item{grid-template-columns:100px minmax(0,1fr) 132px;gap:16px}.line-photo{width:100px;height:130px;grid-row:1/3}.line-name{grid-column:2;grid-row:1/3}.line-quantity{grid-column:3;grid-row:1}.line-price{grid-column:3;grid-row:2;font-size:19px;text-align:center}.cart-columns{grid-template-columns:1fr 132px;gap:16px}.cart-columns span:last-child{display:none}.line-name h3{font-size:23px}.cart-extras{grid-template-columns:230px 1fr;gap:32px}.extras-heading h2{font-size:30px}.extra-card{gap:14px}.extra-photo{width:95px;height:140px}.extra-info h3{font-size:21px}.extra-info>p:not(.extra-system){font-size:12px}} @media(max-width:1000px){.cart-layout{grid-template-columns:minmax(0,1fr) 330px;gap:28px}.line-item{grid-template-columns:86px 1fr;gap:14px 18px}.line-photo{width:86px;height:108px;grid-row:1;align-self:start}.line-name{grid-column:2;grid-row:1}.line-quantity{grid-column:2;grid-row:2;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.line-quantity .remove-item{width:auto;padding-inline:8px;margin:0}.line-price{grid-column:1;grid-row:2;text-align:left;align-self:start;font-size:17px;padding-top:11px}.quantity-error{flex-basis:100%}.cart-columns{display:flex}.cart-columns span:nth-child(2){display:none}.cart-extras{display:block}.extras-heading{margin-bottom:24px}.extras-heading>p:last-child{max-width:none}.extras-grid{gap:32px}.extra-photo{width:120px;height:150px}.extra-info h3{font-size:24px}.extra-info>p:not(.extra-system){font-size:14px}} @media(max-width:760px){.cart-layout{grid-template-columns:1fr;gap:28px}.cart-shipping-card{display:block;margin-top:14px}.csc-inner{display:flex;align-items:center;gap:14px;background:var(--cream);border:1px solid var(--line);border-radius:6px;padding:14px 16px}.csc-icon{flex:0 0 46px;width:46px;height:46px;border-radius:50%;background:#e7dbcd;display:grid;place-items:center;color:var(--blue)}.csc-icon svg{width:24px;height:24px}.csc-body{flex:1 1 auto;min-width:0}.csc-text{font-size:15px;line-height:1.35;color:var(--blue);margin:0}.csc-text strong{font-weight:600}.cart-shipping-card .shipping-track{margin:10px 0 6px}.csc-scala{display:flex;justify-content:space-between;gap:12px;margin:0;font-size:13px;font-variant-numeric:tabular-nums}.csc-scala strong{color:var(--blue);font-weight:600}.csc-scala span{color:var(--muted)}.order-summary .shipping-progress{display:none}.cart-heading{margin:8px 0 24px}.cart-heading h1{font-size:46px;gap:14px}.cart-heading .eyebrow{font-size:10px}.cart-heading>.continue-link{font-size:13px}.cart-columns{display:none}.line-item{grid-template-columns:108px 1fr 132px;gap:16px 20px;padding:24px 0}.line-item:first-child{border-top:1px solid var(--line)}.line-photo{width:108px;height:130px;grid-row:1/3}.line-name{grid-column:2;grid-row:1/3}.line-quantity{grid-column:3;grid-row:1;display:block}.line-quantity .remove-item{width:100%;margin-top:5px}.line-price{grid-column:3;grid-row:2;text-align:center;padding:0}.order-aside{position:static}.order-summary{padding:26px}.order-summary h2{font-size:32px}.shipping-progress{padding-top:20px}.order-totals dt>span{display:inline;margin-left:8px}.grand-total dd{font-size:32px}.shipping-track{height:4px}.order-assurance{justify-content:center}.cart-extras{margin-top:30px;padding:32px 0 40px}.extras-heading h2{font-size:34px}.mobile-checkout:not([hidden]){position:fixed;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:30;background:#fff;border-top:1px solid var(--line);padding:12px 20px max(12px,env(safe-area-inset-bottom));box-shadow:0 -3px 18px #002a520a}.mobile-checkout>div>span{display:block;font-size:11px;color:var(--muted);margin-bottom:2px}.mobile-checkout strong{font-size:23px;line-height:1.2;color:var(--blue);font-weight:600;white-space:nowrap}.mobile-checkout .button{width:auto;min-height:48px;font-size:15px;padding:10px 24px;gap:20px}.has-sticky .preview-label{bottom:92px}.has-sticky .toast{bottom:102px}footer .footer-bottom{padding-bottom:106px}} @media(max-width:600px){.cart-breadcrumb{padding:9px 0;font-size:12px;gap:9px}.cart-heading{display:block;margin:12px 0 16px}.cart-heading h1{font-size:42px}.heading-count{font-size:14px;width:29px;height:29px;min-width:29px}.cart-heading>.continue-link{margin-top:8px;font-size:14px;min-height:36px}.cart-heading .eyebrow{font-size:10px;margin-bottom:6px}.line-item{grid-template-columns:88px minmax(0,1fr);gap:14px 18px;padding:22px 0}.line-photo{width:88px;height:108px;grid-row:1;grid-column:1}.line-name{grid-column:2;grid-row:1}.line-name h3{font-size:25px;margin-bottom:5px}.line-brand{font-size:10px;margin-bottom:5px}.line-format{font-size:13px}.line-unit{font-size:12px;margin-top:8px}.line-quantity{grid-column:2;grid-row:2;display:flex;gap:0 12px;flex-wrap:wrap;align-items:center}.line-quantity .remove-item{width:auto;margin:0;padding:0;font-size:12px}.line-price{grid-column:1;grid-row:2;font-size:17px;align-self:start;text-align:left;padding-top:10px}.remove-item svg{display:none}.quantity-hint{font-size:12px;margin-top:12px}.order-summary{padding:22px}.order-summary>.eyebrow{font-size:10px}.order-summary h2{font-size:32px}.order-totals dt>span{display:block;margin-left:0}.shipping-message p{font-size:15px}.shipping-threshold{font-size:12px}.order-assurance{font-size:12px;padding:14px 0;gap:7px}.extras-grid{grid-template-columns:1fr;gap:24px}.extra-card{gap:22px}.extra-photo{width:116px;height:142px}.extra-info h3{font-size:25px}.extra-info>p:not(.extra-system){font-size:13px}.extra-info>strong{font-size:18px}.extra-add{max-width:180px}.extras-heading h2{font-size:32px}.extras-heading>p:last-child{font-size:14px}.cart-extras{margin-top:28px}.undo-notice{font-size:13px;gap:6px;padding:8px 10px;flex-wrap:wrap;margin-top:0}.undo-notice>span{flex-basis:calc(100% - 34px)}.undo-notice #undo-remove{margin-left:22px}.undo-notice .icon-button{margin-left:auto}#empty-cart{padding:34px 18px}#empty-cart h2{font-size:38px}#empty-cart>p:not(.eyebrow){font-size:16px}#empty-cart>p br{display:none}.empty-categories{gap:4px 18px}.empty-categories a{font-size:13px}#empty-cart .eyebrow{font-size:10px}.preview-label{font-size:8px}.preview-total{font-size:15px}.preview-total strong{font-size:23px}} @media(max-width:370px){.line-item{grid-template-columns:76px minmax(0,1fr);gap:12px}.line-photo{width:76px;height:100px}.line-name h3{font-size:23px}.line-quantity{gap:8px}.line-price{font-size:16px}.order-summary{padding:18px}.mobile-checkout{padding-inline:16px!important}.mobile-checkout .button{padding-inline:18px}.cart-heading h1{font-size:38px}} /* ============================================================ * Innesto WooCommerce (Design 5) — separato dalla copia sopra, * invariata riga per riga da "DESIGN BY CODEX/cart/v1/cart.css". * Qui SOLO gli adattamenti resi necessari da markup nativo WooCommerce che * il prototipo statico non aveva (nessuna riscrittura delle regole sopra). * ============================================================ */ /* Campo quantità: stesso adattamento della scheda prodotto (css/product.css) — WooCommerce avvolge pulsanti +/- (inc/quantity-buttons.php) e input.qty in un
nativo, annidato dentro il .quantity-control del prototipo. display:contents toglie quel div dalla resa: le regole ".quantity-control button/input" copiate sopra bastano da sole, perché sono selettori discendenti (non diretti). */ .quantity-control .quantity { display: contents; } /* Stesso motivo/tecnica della regola sopra: ".product-remove" è l'involucro nativo richiesto dal clic AJAX di WooCommerce sul pulsante "Entfernen" (vedi il commento nel markup, woocommerce/cart/cart.php) — tolto dalla resa perché ".remove-item" del prototipo (copiato sopra) resti l'unico elemento visibile. */ .product-remove { display: contents; } /* Pulsante di ripiego "Warenkorb aktualisieren" (funzione mantenuta, Design 5): il prototipo non lo prevede (aggiorna sempre da solo via JavaScript), quindi non ha una classe propria nel CSS copiato sopra. Resta nel DOM e visibile di default — la classe che lo nasconde la aggiunge solo js/cart.js quando lo script parte davvero (stesso meccanismo di prima della Design 5: se il JavaScript non parte, il pulsante resta a vista e il cliente può sempre aggiornare a mano). */ .update-cart-fallback { margin-top: 16px; } .update-cart-fallback.cb-update-cart-hidden { display: none !important; } /* woocommerce/notices/success.php ed error.php tengono le classi native "woocommerce-message"/"woocommerce-error" accanto a ".undo-notice" (serve all'aggiornamento AJAX del carrello per ritrovare il messaggio, vedi i commenti in quei due file) — qui si toglie lo stile nativo di quelle due classi (bordo colorato, icona ::before, padding proprio del foglio WooCommerce di base), perché resti solo l'aspetto ".undo-notice" del prototipo copiato sopra. */ .undo-notice.woocommerce-message, .undo-notice.woocommerce-error { list-style: none; } .undo-notice.woocommerce-message::before, .undo-notice.woocommerce-error::before { content: none; } /* Messaggi WooCommerce (woocommerce/notices/success.php e error.php, Design 5): stessa scatola ".undo-notice" del prototipo, ma il pulsante "Rückgängig" e la "×" non hanno gli id fissi del prototipo (#undo-remove/ #dismiss-undo) — più messaggi nativi possono comparire nella stessa pagina (rimozione + errore quantità, per esempio), un id ripetuto due volte non è valido HTML. Stessi valori del prototipo, solo selettore di classe al posto dell'id. */ .undo-notice__action { min-height: 44px; background: none; border: 0; padding: 8px; font-size: 14px; color: var(--blue); text-decoration: underline; text-underline-offset: 4px; } .undo-notice__dismiss { width: 44px; height: 44px; } .undo-notice__dismiss svg { width: 18px; } /* Variante errore (tetto di 20 pezzi, coupon non valido, ecc.): il prototipo non prevede una scatola di errore distinta dal successo — qui solo il colore già usato dal prototipo stesso per gli errori di riga (".quantity-error", copiato sopra), non un colore nuovo. */ .undo-notice--error { border-color: var(--blue-dark); } .undo-notice--error svg { color: var(--blue-dark); } /* Riquadro carrello vuoto: nel prototipo è dentro lo stesso
; qui ogni sezione di primo livello porta la propria classe "container" (stessa tecnica di woocommerce/archive- product.php) invece di un unico div avvolgente — vedi page-cart.php. Le dichiarazioni ".cart-breadcrumb/.cart-heading/#empty-cart/.undo-notice" restano quelle copiate sopra, non riscritte: "container" aggiunge solo la larghezza massima e il margine laterale già definiti da quella classe globale (css/base.css, invariata dalla Fase 1). Fedeltà 4 (§3.5): ".extras-heading"/".extras-grid" NON portano più "container" (tolta da inc/cart.php) — erano figlie dirette della griglia CSS ".cart-extras{display:grid;grid-template-columns:280px 1fr}", e "container" applicata a un elemento GRID CHILD si centra dentro la propria colonna (280px), non dentro la riga intera: risultato, il testo finiva a x=56 invece di x=80 (56 = metà del "calc(100% - 112px)" di .container applicato a una colonna di 280px, non ai 1440px della sezione). Il centraggio è stato spostato su ".cart-extras" stesso (sotto, dopo la copia invariata) — verificato contro il prototipo: lì ".cart-extras" non ha "container" perché non ne ha bisogno, è già figlia di un unico "
"; qui, senza quell'unico wrapper, deve centrarsi da sola. */ /* Verificato sullo staging (screenshot di fedeltà): senza queste due regole due elementi nativi WooCommerce restano col loro aspetto di default invece di quello del prototipo, perché i selettori nativi hanno una specificità CSS più alta delle sole classi del prototipo copiate sopra: - "button, ..., a.button, ..." (CSS del tema padre GeneratePress, in un