/* Carrello a cassetto, dal mockup (Prodotto.html righe 1310-1330), 2026-10-20.
   Velo nero al 50%, pannello da destra largo 460 px (pieno da telefono), scatola con la camicia che cade. */

.fiore-carrello-apri { font: 400 12px/1 var(--wp--preset--font-family--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--wp--preset--color--ink); text-decoration: none; white-space: nowrap; padding: 14px 0; }
.fiore-carrello-apri:hover { text-decoration: underline; text-underline-offset: 4px; }

html.fiore-cassetto-aperto, html.fiore-cassetto-aperto body { overflow: hidden; }
.fiore-cassetto { position: fixed; inset: 0; z-index: 96; }
.fiore-cassetto[hidden] { display: none; }
.fiore-cassetto__velo { position: absolute; inset: 0; background: rgba(0, 0, 0, .5); opacity: 0; transition: opacity .25s ease; }
.fiore-cassetto__pannello { position: absolute; top: 0; right: 0; bottom: 0; width: 460px; max-width: 100%; background: var(--wp--preset--color--paper); overflow-y: auto; overflow-x: hidden; display: grid; align-content: start; transform: translateX(100%); transition: transform .25s ease; outline: 0; }
.fiore-cassetto.is-aperto .fiore-cassetto__velo { opacity: 1; }
.fiore-cassetto.is-aperto .fiore-cassetto__pannello { transform: none; }

.fiore-cassetto__testa { display: flex; justify-content: space-between; align-items: center; padding: 14px 10px 14px 22px; border-bottom: 1px solid var(--wp--preset--color--line); font: 400 11px/1 var(--wp--preset--font-family--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.fiore-cassetto__x { width: 44px; height: 44px; background: none; border: 0; font: 300 28px/1 var(--wp--preset--font-family--sans); color: var(--wp--preset--color--ink); cursor: pointer; }

.fiore-cassetto__scatola-blocco { padding: 26px 22px 22px; display: grid; gap: 18px; justify-items: center; text-align: center; border-bottom: 1px solid var(--wp--preset--color--line); }
.fiore-cassetto__scatola { position: relative; width: 150px; height: 108px; margin-top: 34px; }
.fiore-cassetto__camicia { position: absolute; left: 50%; top: 30px; width: 46px; height: 46px; transform: translate(-50%, 14px); z-index: 1; color: var(--wp--preset--color--ink); display: block; }
.fiore-cassetto__corpo, .fiore-cassetto__coperchio { position: absolute; left: 0; display: block; overflow: visible; fill: #fff; stroke: var(--wp--preset--color--ink); stroke-width: 1.4; stroke-linejoin: round; }
.fiore-cassetto__corpo { bottom: 0; z-index: 2; }
.fiore-cassetto__coperchio { top: 16px; z-index: 4; transform-origin: 10% 100%; }
.fiore-cassetto__logo { position: absolute; left: 50%; bottom: 20px; width: 56px; transform: translateX(-50%); z-index: 3; display: block; }
.fiore-cassetto__titolo { display: grid; gap: 6px; }
.fiore-cassetto__titolo h2, .fiore-cassetto__vuoto h2 { margin: 0; font-size: 26px; line-height: 1.1; font-weight: 400; }
.fiore-cassetto__titolo p, .fiore-cassetto__vuoto p { margin: 0; font: 400 14px/1.5 var(--wp--preset--font-family--sans); color: var(--wp--preset--color--text); text-wrap: pretty; }
.fiore-cassetto__passi { list-style: none; margin: 0; padding: 0; width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.fiore-cassetto__passi li { display: grid; gap: 8px; justify-items: center; font: 400 12px/1.35 var(--wp--preset--font-family--sans); color: var(--wp--preset--color--ink); text-wrap: balance; }
.fiore-cassetto__passi li span { width: 28px; height: 28px; display: block; }
.fiore-cassetto__vuoto { padding: 48px 22px; display: grid; gap: 14px; justify-items: center; text-align: center; }

.fiore-cassetto__corpo-lista { padding: 6px 22px 0; }
.fiore-cassetto__riga { display: grid; grid-template-columns: 60px minmax(0, 1fr) auto; gap: 14px; align-items: start; padding: 16px 0; border-bottom: 1px solid var(--wp--preset--color--line); }
.fiore-cassetto__foto { display: block; aspect-ratio: 4 / 5; background: var(--wp--preset--color--paper-alt); overflow: hidden; }
.fiore-cassetto__foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; display: block; }
.fiore-cassetto__dati { display: grid; gap: 4px; min-width: 0; }
.fiore-cassetto__dati b { font: 400 17px/1.2 var(--wp--preset--font-family--serif); }
.fiore-cassetto__dati span { font: 400 12.5px/1.4 var(--wp--preset--font-family--sans); color: var(--wp--preset--color--text); }
.fiore-cassetto__dati .fiore-cassetto__extra { color: var(--wp--preset--color--ink); }
.fiore-link { justify-self: start; margin-top: 4px; background: none; border: 0; padding: 0 0 4px; cursor: pointer; font: 900 11px/1 var(--wp--preset--font-family--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--ink); border-bottom: 2px solid var(--wp--preset--color--ink); }
.fiore-link:disabled { opacity: .4; cursor: wait; }
.fiore-prezzo { font: 400 16px/1.2 var(--wp--preset--font-family--serif); font-variant-numeric: tabular-nums; white-space: nowrap; }

.fiore-cassetto__conti { margin: 0; padding: 14px 0 0; display: grid; gap: 8px; }
.fiore-cassetto__conti > div { display: flex; justify-content: space-between; font: 400 14px/1.4 var(--wp--preset--font-family--sans); }
.fiore-cassetto__conti dt { color: var(--wp--preset--color--text); }
.fiore-cassetto__conti dd { margin: 0; }
.fiore-cassetto__conti .fiore-cassetto__totale { align-items: baseline; border-top: 1px solid var(--wp--preset--color--line-strong); padding-top: 10px; }
.fiore-cassetto__totale dt { color: var(--wp--preset--color--ink); font-size: 14px; line-height: 1; }
.fiore-cassetto__totale .fiore-prezzo { font-size: 22px; }
.fiore-cassetto__azioni { display: grid; gap: 8px; padding: 18px 0 24px; }

/* bottoni del mockup: si invertono al passaggio */
.fiore-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 22px; border: 1px solid var(--wp--preset--color--ink); font: 900 12.5px/1 var(--wp--preset--font-family--sans); letter-spacing: .09em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: background-color .2s ease, color .2s ease; }
.fiore-btn--ink { background: var(--wp--preset--color--ink); color: var(--wp--preset--color--paper); }
.fiore-btn--ink:hover { background: transparent; color: var(--wp--preset--color--ink); }
.fiore-btn--linea { background: transparent; color: var(--wp--preset--color--ink); }
.fiore-btn--linea:hover { background: var(--wp--preset--color--ink); color: var(--wp--preset--color--paper); }
.fiore-btn--mini { min-height: 44px; padding: 0 12px; font-size: 11px; } /* 44 px: bersaglio del tocco */
.fiore-btn:disabled { opacity: .5; cursor: wait; }

.fiore-cassetto__simili { background: var(--wp--preset--color--paper-alt); padding: 24px 22px 28px; display: grid; gap: 14px; }
.fiore-cassetto__simili-testa { display: grid; gap: 6px; }
.fiore-cassetto__simili h3 { margin: 0; font-size: 22px; line-height: 1.15; font-weight: 400; }
.fiore-cassetto__simili-testa p { margin: 0; font: 400 13.5px/1.5 var(--wp--preset--font-family--sans); color: var(--wp--preset--color--text); text-wrap: pretty; }
.fiore-cassetto__simile { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 14px; align-items: center; background: var(--wp--preset--color--paper); padding: 10px; }
.fiore-cassetto__simile-dati { display: grid; gap: 8px; min-width: 0; }
.fiore-cassetto__simile-dati > div:first-child { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.fiore-cassetto__simile-dati b { font: 400 16px/1.2 var(--wp--preset--font-family--serif); }
.fiore-cassetto__simile-dati > div:first-child span { font: 400 13px/1 var(--wp--preset--font-family--sans); white-space: nowrap; }
.fiore-cassetto__simile-btn { display: flex; flex-wrap: wrap; gap: 6px 10px; }
.fiore-cassetto__msg { font: 400 12px/1.3 var(--wp--preset--font-family--sans); color: var(--wp--preset--color--muted); }
.fiore-cassetto__msg:empty { display: none; }

.fiore-aggiunta-errore { margin: 10px 0 0; font: 400 13.5px/1.45 var(--wp--preset--font-family--sans); color: #8a1c1c; }
.single_add_to_cart_button.is-carica { opacity: .7; cursor: wait; }

@media (max-width: 760px) {
	.fiore-cassetto__pannello { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
	.fiore-cassetto__velo, .fiore-cassetto__pannello { transition: none; }
}