/* =============================================================================
   Wishlist v2 — Card grid + empty state + share + alerts
   File: assets/css/wishlist.css
   ============================================================================= */

.ds-wl{padding:32px 0 80px}

/* HEADER */
.ds-wl__head{margin-bottom:24px}
.ds-wl__title{
	font-size:32px;
	font-weight:800;
	letter-spacing:-.02em;
	margin:0 0 6px;
	color:var(--ds-black);
}
.ds-wl__head-meta{
	font-size:13px;
	color:var(--ds-muted);
	font-weight:500;
}

/* TOOLBAR */
.ds-wl__toolbar{
	display:flex;
	align-items:center;
	gap:16px;
	padding:14px 16px;
	background:var(--ds-surface-2);
	border-radius:12px;
	margin-bottom:20px;
	flex-wrap:wrap;
	position:relative;
}
.ds-wl__bulk-all{
	display:inline-flex;
	align-items:center;
	gap:8px;
	font-size:13px;
	font-weight:600;
	color:var(--ds-black);
	cursor:pointer;
}
.ds-wl__bulk-all input{
	width:18px;height:18px;
	cursor:pointer;
	accent-color:var(--ds-black);
}
.ds-wl__bulk-actions{
	display:inline-flex;
	align-items:center;
	gap:10px;
	margin-left:auto;
}
.ds-wl__bulk-count{
	font-size:12px;
	color:var(--ds-muted);
	font-weight:500;
}
.ds-wl__bulk-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:8px 14px;
	border-radius:99px;
	font-size:12px;
	font-weight:700;
	letter-spacing:.02em;
	border:1.5px solid var(--ds-black);
	background:#fff;
	color:var(--ds-black);
	cursor:pointer;
	transition:background .15s ease, opacity .15s ease;
}
.ds-wl__bulk-btn:disabled{opacity:.4;cursor:not-allowed}
.ds-wl__bulk-btn--primary{background:var(--ds-yellow);border-color:var(--ds-yellow)}
.ds-wl__bulk-btn--primary:not(:disabled):hover{background:var(--ds-yellow-dark);border-color:var(--ds-yellow-dark)}
.ds-wl__bulk-btn--ghost:not(:disabled):hover{background:#fff;color:var(--ds-black)}

/* SHARE */
.ds-wl__share-btn{
	display:inline-flex;
	align-items:center;
	gap:6px;
	padding:8px 14px;
	border-radius:99px;
	font-size:12px;
	font-weight:700;
	border:1.5px solid var(--ds-black);
	background:transparent;
	color:var(--ds-black);
	cursor:pointer;
}
.ds-wl__share-btn:hover{background:var(--ds-black);color:#fff}
/* ================================================================
   SHARE MODAL (vero, con backdrop + dialog centrato + focus trap)
   ================================================================ */
.ds-wl-modal{
	position:fixed;
	inset:0;
	z-index:10004;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:20px;
}
.ds-wl-modal[hidden]{display:none}
.ds-wl-modal__backdrop{
	position:absolute;
	inset:0;
	background:rgba(0,0,0,.55);
	backdrop-filter:blur(3px);
	-webkit-backdrop-filter:blur(3px);
	opacity:0;
	animation:dsWlFade .2s ease forwards;
	cursor:pointer;
}
.ds-wl-modal__dialog{
	position:relative;
	background:#fff;
	border-radius:18px;
	box-shadow:0 24px 60px rgba(0,0,0,.3);
	width:100%;
	max-width: 520px;
	max-height:90vh;
	overflow:auto;
	transform:translateY(20px) scale(.96);
	opacity:0;
	animation:dsWlPop .25s cubic-bezier(.16,1,.3,1) .05s forwards;
}
@keyframes dsWlFade{to{opacity:1}}
@keyframes dsWlPop{to{transform:translateY(0) scale(1);opacity:1}}

.ds-wl-modal__head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:20px 24px;
	border-bottom:1px solid var(--ds-border);
}
.ds-wl-modal__title{
	margin:0;
	font-size:18px;
	font-weight:800;
	color:var(--ds-black);
	letter-spacing:-.01em;
}
.ds-wl-modal__close{
	width:36px;
	height:36px;
	border-radius:50%;
	background:var(--ds-surface-2);
	border:0;
	cursor:pointer;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	color:var(--ds-black);
	transition:background .15s;
}
.ds-wl-modal__close:hover{background:#e6e3dd}

.ds-wl-modal__body{padding:22px 24px 16px}
.ds-wl-modal__desc{
	margin:0 0 18px;
	font-size:13px;
	color:var(--ds-muted);
	line-height:1.5;
}

.ds-wl-modal__field{margin-bottom:22px}
.ds-wl-modal__label{
	display:block;
	font-size:11px;
	font-weight:700;
	letter-spacing:.08em;
	text-transform:uppercase;
	color:var(--ds-muted);
	margin-bottom:8px;
}
.ds-wl-modal__inputrow{
	display:flex;
	gap:8px;
	background:var(--ds-surface-2);
	border:1px solid var(--ds-border);
	border-radius:10px;
	padding:4px;
}
.ds-wl-modal__inputrow input{
	flex:1;
	min-width:0;
	border:0;
	background:transparent;
	padding:10px 12px;
	font:inherit;
	font-size:13px;
	font-family:'SF Mono', Menlo, monospace;
	color:var(--ds-black);
	outline:none;
}
.ds-wl-modal__copy{
	padding:10px 18px;
	border-radius:8px;
	background:var(--ds-black);
	color:#fff;
	border:0;
	font:inherit;
	font-size:13px;
	font-weight:700;
	cursor:pointer;
	white-space:nowrap;
	transition:background .15s;
}
.ds-wl-modal__copy:hover{background:#000}
.ds-wl-modal__copy.is-copied{background:var(--ds-success)}

.ds-wl-modal__channels-label{
	font-size:11px;
	font-weight:700;
	letter-spacing:.08em;
	text-transform:uppercase;
	color:var(--ds-muted);
	margin-bottom:8px;
}
.ds-wl-modal__channels{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:10px;
}
.ds-wl-modal__ch{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	padding:12px 16px;
	border-radius:10px;
	font:inherit;
	font-size:13px;
	font-weight:700;
	text-decoration:none;
	border:1px solid var(--ds-border);
	color:var(--ds-black);
	background:#fff;
	cursor:pointer;
	transition:background .15s, border-color .15s, transform .12s;
}
.ds-wl-modal__ch:hover{
	background:var(--ds-surface-2);
	border-color:#d6d3cd;
	transform:translateY(-1px);
}
.ds-wl-modal__ch-icon{display:inline-flex;align-items:center;justify-content:center}
.ds-wl-modal__ch--wa{background:#25d366;color:#fff;border-color:#25d366}
.ds-wl-modal__ch--wa:hover{background:#1faa54;color:#fff;border-color:#1faa54}
.ds-wl-modal__ch--em{background:var(--ds-black);color:#fff;border-color:var(--ds-black)}
.ds-wl-modal__ch--em:hover{background:#000;color:#fff;border-color:#000}

.ds-wl-modal__foot{
	padding:16px 24px 22px;
	border-top:1px solid var(--ds-border);
	display:flex;
	justify-content:flex-end;
}
.ds-wl-modal__regen{
	background:transparent;
	border:0;
	font:inherit;
	font-size:12px;
	font-weight:600;
	color:var(--ds-muted);
	cursor:pointer;
	padding:6px 0;
	text-decoration:underline;
	text-underline-offset:3px;
}
.ds-wl-modal__regen:hover{color:var(--ds-black)}
.ds-wl-modal__regen:disabled{opacity:.5;cursor:wait}

/* lock scroll quando modal aperto */
html.ds-wl-modal-open{overflow:hidden}

@media (max-width: 560px){
	.ds-wl-modal__dialog{max-width:100%;border-radius:14px}
	.ds-wl-modal__channels{grid-template-columns:1fr}
}

/* CARD GRID — riusa .ds-card del shop (card-redesign.css), aggiungiamo solo overlay wishlist */
.ds-wl__grid{
	list-style:none;
	margin:0;
	padding:0;
	display:grid !important;
	grid-template-columns:repeat(3, 1fr);
	gap:24px;
}
@media (max-width: 900px){
	.ds-wl__grid{grid-template-columns:repeat(2, 1fr) !important;gap:16px}
}
@media (max-width: 560px){
	.ds-wl__grid{grid-template-columns:1fr !important}
}

/* Item ds-card dentro la wishlist: position relative per overlay */
.ds-wl__grid .ds-card.ds-wl-item{
	position:relative;
}
/* Nascondi cuore wishlist nativo della card del shop (ridondante nella wishlist page) */
.ds-wl__grid .ds-card.ds-wl-item .ds-wishlist-btn{
	display:none !important;
}
/* Stato OOS */
.ds-wl__grid .ds-card.ds-wl-item.is-oos{opacity:.85}

/* Overlay checkbox bulk (top-left) */
.ds-wl__overlay-check{
	position:absolute;
	top:12px;
	left:12px;
	z-index:5;
	background:rgba(255,255,255,.95);
	border:1px solid var(--ds-border);
	border-radius:8px;
	width:32px;
	height:32px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	cursor:pointer;
	box-shadow:0 2px 6px rgba(0,0,0,.08);
}
.ds-wl__overlay-check input{
	width:18px;
	height:18px;
	cursor:pointer;
	accent-color:var(--ds-black);
	margin:0;
}

/* Overlay remove X (top-right) */
.ds-wl__overlay-remove{
	position:absolute;
	top:12px;
	right:12px;
	z-index:5;
	width:32px;
	height:32px;
	border-radius:50%;
	background:#fff;
	border:1px solid var(--ds-border);
	color:var(--ds-black);
	display:inline-flex;
	align-items:center;
	justify-content:center;
	cursor:pointer;
	transition:background .15s, color .15s;
	box-shadow:0 2px 6px rgba(0,0,0,.08);
}
.ds-wl__overlay-remove:hover{
	background:var(--ds-black);
	color:#fff;
	border-color:var(--ds-black);
}

/* ALERT OOS section (sotto la grid) */
.ds-wl__alerts-section{
	margin-top:48px;
	padding:24px;
	background:var(--ds-surface);
	border:1px solid var(--ds-border);
	border-radius:14px;
}
.ds-wl__alerts-title{
	font-size:16px;
	font-weight:800;
	margin:0 0 14px;
	color:var(--ds-black);
}
.ds-wl__alerts-list{
	list-style:none;
	margin:0;
	padding:0;
	display:flex;
	flex-direction:column;
	gap:10px;
}
.ds-wl__alert-row{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	padding:10px 14px;
	background:#fff;
	border:1px solid var(--ds-border);
	border-radius:10px;
	font-size:13px;
}
.ds-wl__alert-name{font-weight:600}
.ds-wl__alert{
	display:inline-flex;
	align-items:center;
	gap:8px;
	font-size:12px;
	color:var(--ds-muted);
	cursor:pointer;
	font-weight:500;
}
.ds-wl__alert input{
	width:14px;
	height:14px;
	accent-color:var(--ds-yellow);
	margin:0;
}
.ds-wl__alert input:checked + span{color:var(--ds-black);font-weight:600}

/* EMPTY STATE */
.ds-wl__empty{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:14px;
	padding:60px 24px;
	text-align:center;
	background:var(--ds-surface);
	border:1px solid var(--ds-border);
	border-radius:16px;
	margin-bottom:48px;
}
.ds-wl__empty-icon{color:var(--ds-muted);opacity:.6}
.ds-wl__empty-title{
	font-size:22px;
	font-weight:800;
	margin:0;
	color:var(--ds-black);
}
.ds-wl__empty-text{
	font-size:14px;
	color:var(--ds-muted);
	max-width: 420px;
	margin:0;
}
.ds-wl__empty-cta{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:14px 28px;
	background:var(--ds-yellow);
	color:var(--ds-black);
	border-radius:99px;
	font-size:13px;
	font-weight:700;
	letter-spacing:.02em;
	text-decoration:none;
	margin-top:8px;
	box-shadow:0 4px 14px rgba(255,193,7,.3);
}
.ds-wl__empty-cta:hover{background:var(--ds-yellow-dark);color:var(--ds-black)}

/* SUGGESTED */
.ds-wl__suggested{margin-top:24px}
.ds-wl__suggested-title{
	font-size:18px;
	font-weight:800;
	margin:0 0 16px;
	color:var(--ds-black);
}
.ds-wl__suggested-grid{
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	gap:16px;
}
@media (max-width: 900px){.ds-wl__suggested-grid{grid-template-columns:repeat(2, 1fr)}}
.ds-wl__sug-card{
	display:flex;
	flex-direction:column;
	gap:8px;
	text-decoration:none;
	color:var(--ds-black);
	background:#fff;
	border:1px solid var(--ds-border);
	border-radius:12px;
	overflow:hidden;
	transition:border-color .15s, box-shadow .15s;
}
.ds-wl__sug-card:hover{border-color:#d6d3cd;box-shadow:0 6px 20px rgba(0,0,0,.05)}
.ds-wl__sug-thumb{
	aspect-ratio:1/1;
	background:var(--ds-surface-2);
	overflow:hidden;
}
.ds-wl__sug-thumb img{
	width:100% !important;
	height:100% !important;
	object-fit:cover;
	display:block;
}
.ds-wl__sug-name{padding:0 12px;font-size:13px;font-weight:600;line-height:1.3}
.ds-wl__sug-price{padding:0 12px 12px;font-size:13px;font-weight:800}
