/**
 * Mini carrello laterale (da destra) con suggerimenti.
 * Riferimento: demo Bricksify "Mini Cart Suggestions".
 */
.cameli-drawer { --cd-line: #e5e5e5; --cd-soft: #f5f5f5; --cd-ink: #111; --cd-muted: #6b6b6b; --cd-r: 8px; --cd-w: min(1120px, 100vw); }
.cameli-drawer[hidden] { display: none; }
.cameli-drawer { position: fixed; inset: 0; z-index: 100000; }
.cameli-drawer__backdrop { position: absolute; inset: 0; background: rgba(17, 17, 17, .45); opacity: 0; transition: opacity .3s ease; }
.cameli-drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; width: var(--cd-w); background: #fff; transform: translateX(100%); transition: transform .35s cubic-bezier(.2, .7, .2, 1); outline: none; box-shadow: -12px 0 40px rgba(0, 0, 0, .12); }
.cameli-drawer.is-open .cameli-drawer__backdrop { opacity: 1; }
.cameli-drawer.is-open .cameli-drawer__panel { transform: none; }
html.cd-lock, html.cd-lock body { overflow: hidden; }
@media (prefers-reduced-motion: reduce) { .cameli-drawer__panel, .cameli-drawer__backdrop { transition: none; } }

.cameli-drawer-content { display: grid; grid-template-columns: minmax(0, 28.5%) minmax(0, 1fr); height: 100%; color: var(--cd-ink); font-size: 1.4rem; line-height: 1.4; }
.cameli-drawer-content:not(:has(.cd-col--sugg)) { grid-template-columns: minmax(0, 1fr); }
.cameli-drawer-content.is-loading { display: flex; align-items: center; justify-content: center; }
.cd-loading { width: 28px; height: 28px; border: 2px solid var(--cd-line); border-top-color: var(--cd-ink); border-radius: 50%; animation: cd-spin .8s linear infinite; }
@keyframes cd-spin { to { transform: rotate(360deg); } }
.cameli-drawer-content.is-busy .cd-col--cart { opacity: .55; pointer-events: none; transition: opacity .15s; }

.cd-col { display: flex; flex-direction: column; min-height: 0; }
.cd-col--sugg { border-right: 1px solid var(--cd-line); background: #fff; }
.cd-head { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; min-height: 60px; padding: 1.4rem 1.6rem; border-bottom: 1px solid var(--cd-line); flex-shrink: 0; }
.cd-col--cart .cd-head { padding: 1.4rem 2rem; }
.cd-title { margin: 0; font-family: inherit; font-size: 1.4rem; font-weight: 600; letter-spacing: .3px; text-transform: uppercase; line-height: 1.2; color: var(--cd-ink); }
.cd-count { font-weight: 400; color: var(--cd-muted); }
.cd-close { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin-right: -.8rem; padding: 0; border: 0; background: none; color: var(--cd-ink); cursor: pointer; border-radius: 50%; }
.cd-close:hover { background: var(--cd-soft); }
.cd-close .cd-i { width: 22px; height: 22px; }
.cd-i { width: 1em; height: 1em; flex-shrink: 0; }

/* Suggerimenti (colonna sinistra) */
.cd-sugg-list { flex: 1; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 1.2rem; padding: 1.6rem 1.6rem 3.2rem; }
.cd-sugg { display: flex; flex-direction: column; gap: .8rem; padding: 1.2rem; border: 1px solid var(--cd-line); border-radius: var(--cd-r); background: #fff; }
.cd-sugg__media { position: relative; overflow: hidden; border-radius: 6px; background: var(--cd-soft); aspect-ratio: 1 / 1; }
.cd-sugg__media > a, .cd-sugg__img { display: block; width: 100%; height: 100%; }
.cd-sugg__img { object-fit: contain; mix-blend-mode: multiply; transition: transform .4s ease; }
.cd-sugg:hover .cd-sugg__img { transform: scale(1.05); }
.cd-sugg__add { position: absolute; right: .8rem; bottom: .8rem; display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0; border: 1px solid var(--cd-line); border-radius: 999px; background: #fff; color: var(--cd-ink); cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.cd-sugg__add:hover, .cd-sugg__add:focus-visible { background: var(--cd-ink); border-color: var(--cd-ink); color: #fff; }
.cd-sugg__add .cd-i { width: 16px; height: 16px; }
.cd-sugg__add.is-loading { opacity: .5; pointer-events: none; }
.cd-sugg__add.is-added { background: #2e7d32; border-color: #2e7d32; color: #fff; }
.cd-sugg__name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 1.3rem; font-weight: 500; line-height: 1.35; color: var(--cd-ink); text-decoration: none; }
.cd-sugg__name:hover { text-decoration: underline; }
.cd-sugg__price { font-size: 1.3rem; color: var(--cd-ink); }
.cd-sugg__price del { color: #9e9e9e; margin-right: .4rem; font-size: .9em; }
.cd-sugg__price ins { text-decoration: none; }
.cd-sugg__price .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* Carrello (colonna destra) */
.cd-body { flex: 1; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 1.6rem; padding: 2rem; }
.cd-ship { display: flex; gap: 1.2rem; padding: 1.4rem 1.6rem; border: 1px solid var(--cd-line); border-radius: var(--cd-r); }
.cd-ship__icon { display: flex; padding-top: .1rem; font-size: 2rem; color: var(--cd-ink); }
.cd-ship__body { flex: 1; display: flex; flex-direction: column; gap: .8rem; }
.cd-ship__title { font-size: 1.4rem; }
.cd-ship__title .amount { font-weight: 600; }
.cd-ship__bar { display: block; height: 4px; border-radius: 4px; background: var(--cd-soft); overflow: hidden; }
.cd-ship__bar > span { display: block; height: 100%; background: var(--cd-ink); border-radius: inherit; transition: width .4s ease; }
.cd-ship.is-free .cd-ship__bar > span { background: #2e7d32; }
.cd-ship.is-free .cd-ship__icon { color: #2e7d32; }

.cd-coupon { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; padding: 1rem 1.2rem 1rem 1.6rem; border: 1px dashed #f5bd47; border-radius: var(--cd-r); background: #fffaf0; font-size: 1.3rem; }
.cd-coupon .cameli-coupon__code { flex-direction: row; gap: 1rem; padding: .6rem 1rem; }
.cd-coupon .cameli-coupon__value { font-size: 1.3rem; }

.cd-items { display: flex; flex-direction: column; gap: 1.2rem; margin: 0; padding: 0; list-style: none; }
.cd-item { display: grid; grid-template-columns: 88px minmax(0, 1fr) auto; gap: 1.6rem; padding: 1.6rem; border: 1px solid var(--cd-line); border-radius: var(--cd-r); background: #fff; }
.cd-item__thumb { display: block; width: 88px; height: 110px; border-radius: 6px; background: var(--cd-soft); overflow: hidden; }
.cd-item__thumb img { display: block; width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.cd-item__main { display: flex; flex-direction: column; align-items: flex-start; gap: .8rem; min-width: 0; }
.cd-item__name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 1.4rem; font-weight: 500; line-height: 1.35; color: var(--cd-ink); text-decoration: none; }
.cd-item__name:hover { text-decoration: underline; }
.cd-item__main dl.variation { margin: 0; font-size: 1.2rem; color: var(--cd-muted); }
.cd-item__main dl.variation dt, .cd-item__main dl.variation dd { display: inline; margin: 0; }
.cd-item__main dl.variation dd p { display: inline; margin: 0; }
.cd-item__single { font-size: 1.2rem; color: var(--cd-muted); }
.cd-qty { display: inline-flex; align-items: center; gap: .2rem; margin-top: auto; }
.cd-qty__btn { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 6px; background: none; color: var(--cd-ink); cursor: pointer; }
.cd-qty__btn:hover:not(:disabled) { background: var(--cd-soft); }
.cd-qty__btn:disabled { opacity: .3; cursor: default; }
.cd-qty__btn .cd-i { width: 18px; height: 18px; }
.cd-qty__val { min-width: 2.4rem; text-align: center; font-size: 1.4rem; }
.cd-item__side { display: flex; flex-direction: column; align-items: flex-end; gap: .4rem; text-align: right; }
.cd-item__remove { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; margin-bottom: auto; padding: 0; border: 0; border-radius: 6px; background: #fdecec; color: #d32f2f; cursor: pointer; transition: background .2s; }
.cd-item__remove:hover { background: #f9d4d4; }
.cd-item__remove .cd-i { width: 18px; height: 18px; }
.cd-item__sub { margin-top: 1.2rem; font-size: 1.5rem; font-weight: 500; white-space: nowrap; }
.cd-item__sub del, .cd-item__unit del { color: #9e9e9e; font-weight: 400; font-size: .85em; margin-right: .3rem; }
.cd-item__sub ins, .cd-item__unit ins { text-decoration: none; }
.cd-item__unit { font-size: 1.2rem; color: var(--cd-muted); }
.cd-notes .wow__discount, .cd-notes > * { padding: 1.2rem 1.6rem; border-radius: var(--cd-r); background: #f3f8f2; color: #255d27; font-size: 1.3rem; }

/* Suggerimenti su mobile: fila scorrevole sotto i prodotti */
.cd-sugg-strip { display: none; }
.cd-strip-title { margin: .4rem 0 1rem; font-size: 1.3rem; font-weight: 600; text-transform: uppercase; letter-spacing: .3px; }
.cd-sugg-row { display: grid; grid-auto-flow: column; grid-auto-columns: 46%; gap: 1.2rem; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .4rem; }
.cd-sugg-row .cd-sugg { scroll-snap-align: start; }

.cd-empty { display: flex; flex-direction: column; align-items: center; gap: .8rem; margin: auto; padding: 4rem 1.6rem; text-align: center; }
.cd-empty__icon { display: flex; font-size: 4rem; color: #bfb7b7; margin-bottom: .8rem; }
.cd-empty__title { margin: 0; font-size: 1.8rem; font-weight: 500; }
.cd-empty__text { margin: 0 0 1.2rem; color: var(--cd-muted); }

.cd-gift { display: flex; align-items: center; gap: 1rem; padding: 1.4rem 2rem; background: var(--cd-ink); color: #fff; font-size: 1.3rem; flex-shrink: 0; }
.cd-gift .cd-i { width: 18px; height: 18px; color: #f5bd47; }
.cd-foot { display: flex; flex-direction: column; gap: 1rem; padding: 1.6rem 2rem 2rem; background: var(--cd-soft); flex-shrink: 0; }
.cd-row { display: flex; justify-content: space-between; gap: 1.2rem; font-size: 1.4rem; }
.cd-row--total { font-size: 1.6rem; font-weight: 600; }
.cd-row--total del { color: #9e9e9e; font-weight: 400; font-size: .85em; margin-right: .4rem; }
.cd-row--total ins { text-decoration: none; }
.cd-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 2.4rem; border-radius: 6px; font-size: 1.4rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; text-decoration: none; transition: background .2s; }
.cd-btn--dark { background: var(--cd-ink); color: #fff; }
.cd-btn--dark:hover, .cd-btn--dark:focus-visible { background: #333; color: #fff; }
.cd-btn--block { width: 100%; margin-top: .4rem; }
.cd-link { align-self: center; font-size: 1.3rem; color: var(--cd-ink); text-decoration: underline; text-underline-offset: 3px; }
.cd-express:empty { display: none; }
.cd-pay { align-self: center; max-width: 100%; height: auto; max-height: 24px; width: auto; margin-top: .4rem; }

/* Tablet e mobile: una colonna, larghezza piena fino a 460px */
@media (max-width: 991px) {
  .cameli-drawer { --cd-w: min(460px, 100vw); }
  .cameli-drawer-content { grid-template-columns: minmax(0, 1fr); }
  .cd-col--sugg { display: none; }
  .cd-sugg-strip { display: block; }
  .cd-col--cart .cd-head, .cd-body { padding-left: 1.6rem; padding-right: 1.6rem; }
  .cd-gift { padding: 1.2rem 1.6rem; }
  .cd-foot { padding: 1.4rem 1.6rem calc(1.6rem + env(safe-area-inset-bottom)); }
  .cd-item { grid-template-columns: 72px minmax(0, 1fr) auto; gap: 1.2rem; padding: 1.2rem; }
  .cd-item__thumb { width: 72px; height: 90px; }
}
/* Riga prodotto: nome a tutta larghezza, prezzi sotto (niente colonne strette) */
.cd-item { grid-template-columns: 88px minmax(0, 1fr) auto; grid-template-areas: "thumb name remove" "thumb meta meta" "thumb qty price" "thumb unit unit"; align-items: start; row-gap: .6rem; }
.cd-item__main, .cd-item__side { display: contents; }
.cd-item__thumb { grid-area: thumb; }
.cd-item__name { grid-area: name; align-self: center; }
.cd-item__main dl.variation { grid-area: meta; }
.cd-qty, .cd-item__single { grid-area: qty; align-self: center; margin-top: 0; }
.cd-qty { margin-left: -.8rem; }
.cd-item__remove { grid-area: remove; margin: 0; }
.cd-item__sub { grid-area: price; justify-self: end; align-self: center; margin: 0; }
.cd-item__unit { grid-area: unit; justify-self: end; text-align: right; }
.cd-item__single { color: #a63d2f; }
@media (max-width: 991px) {
  .cd-item { grid-template-columns: 72px minmax(0, 1fr) auto; }
}

/* Pulsante: il tema sovrascrive colore e sfondo dei link */
.cameli-drawer a.cd-btn--dark, .cameli-drawer a.cd-btn--dark:visited { background: #111 !important; color: #fff !important; border: 0; }
.cameli-drawer a.cd-btn--dark:hover, .cameli-drawer a.cd-btn--dark:focus-visible { background: #333 !important; color: #fff !important; }
.cd-cameli { color: #255d27; white-space: nowrap; }