/* Kinetic Ultra — Wishlist Page (variant-a-grid + variant-d-empty) */

/* Digital noise overlay */
.k-wishlist-page::before {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: 0.02;
    z-index: 50;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Page shell */
.k-wishlist-page {
    min-height: 60vh;
    padding: 3rem 0 5rem;
    background: #0e0e13;
    position: relative;
    overflow-x: hidden;
}

/* Ambient glows */
.k-wl-glow { position: absolute; border-radius: 50%; pointer-events: none; z-index: 0; }
.k-wl-glow--tr {
    top: -60px; right: -60px;
    width: 500px; height: 500px;
    background: radial-gradient(circle, rgba(109,221,255,0.06) 0%, transparent 70%);
    filter: blur(60px);
}
.k-wl-glow--bl {
    bottom: 0; left: -80px;
    width: 600px; height: 600px;
    background: radial-gradient(circle, rgba(159,142,255,0.05) 0%, transparent 70%);
    filter: blur(80px);
}
.k-wl-inner {
    position: relative;
    z-index: 1;
    padding-inline: 2rem;
}
@media (min-width: 1024px) {
    .k-wl-inner { padding-inline: 4rem; }
}

/* Page header */
.k-wl-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.5rem;
    flex-wrap: wrap;
    margin-bottom: 2.5rem;
}
.k-wl-header__left { display: flex; align-items: center; gap: 1.25rem; }
.k-wl-header__title {
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(2rem, 5vw, 3.25rem);
    font-weight: 900;
    color: #f9f5fd;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
    line-height: 1.1;
    letter-spacing: -0.02em;
    text-transform: uppercase;
}
/* Violet pill count (Variant A) */
.k-wl-header__count {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .25rem .875rem;
    border-radius: 9999px;
    background: rgba(68,28,200,.2);
    color: #9f8eff;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .9375rem;
    font-weight: 700;
    box-shadow: 0 0 15px rgba(159,142,255,.2);
    flex-shrink: 0;
}
/* Muted "/ 0" (Variant D) */
.k-wl-header__zero {
    font: 300 1.75rem/1 'Space Grotesk', sans-serif;
    color: #00c3eb;
    opacity: .45;
    letter-spacing: -.02em;
}
.k-wl-header__right { display: flex; align-items: center; gap: .875rem; flex-wrap: wrap; }

/* View toggle */
.k-wl-view-toggle { display: flex; align-items: center; gap: 2px; background: #19191f; border-radius: 10px; padding: 3px; }
.k-wl-view-btn {
    display: flex; align-items: center; justify-content: center;
    width: 36px; height: 36px; border-radius: 8px;
    border: none; background: none; color: #76747b; cursor: pointer;
    transition: background .15s, color .15s;
}
.k-wl-view-btn.is-active, .k-wl-view-btn:hover { background: #25252d; color: #f9f5fd; }

/* Buttons — shared base for toolbar / nudge */
.k-btn--wl-primary,
.k-btn--wl-ghost,
.k-btn--wl-danger,
.k-btn--wl-secondary,
.k-btn--wl-nudge-signin,
.k-btn--wl-nudge-register {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    border-radius: 8px;
    font-family: inherit;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    cursor: pointer;
    transition: background .2s, color .2s, border-color .2s, box-shadow .2s;
    text-decoration: none;
    white-space: nowrap;
}

.k-btn--wl-primary {
    padding: .75rem 1.5rem;
    border: none;
    background: linear-gradient(90deg, #6dddff 0%, #00c3eb 100%);
    color: #004c5e;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .875rem;
}
.k-btn--wl-primary:hover { box-shadow: 0 0 20px rgba(109,221,255,.3); transform: scale(1.02); }
.k-btn--wl-primary:active { transform: scale(.97); }

.k-btn--wl-ghost {
    padding: .75rem 1.5rem;
    border: 1px solid rgba(72,71,77,.3);
    background: none;
    color: #9f8eff;
    font-family: 'Space Grotesk', sans-serif;
    font-size: .875rem;
}
.k-btn--wl-ghost:hover { background: rgba(159,142,255,.05); border-color: rgba(159,142,255,.5); color: #9f8eff; }

.k-btn--wl-danger  { padding: .5rem .875rem; border: none; background: none; color: #ff716c; font-size: .875rem; font-weight: 600; }
.k-btn--wl-secondary { padding: .5rem .875rem; border: none; background: none; color: #9f8eff; font-size: .875rem; font-weight: 600; }
.k-btn--wl-danger:hover   { background: rgba(255,113,108,.1); color: #ffa8a3; }
.k-btn--wl-secondary:hover { background: rgba(159,142,255,.1); }

.k-btn--wl-nudge-signin  { padding: .5rem 1.25rem; border: none; background: rgba(109,221,255,.1); color: #6dddff; font-family: 'Space Grotesk', sans-serif; font-size: .8125rem; }
.k-btn--wl-nudge-register { padding: .5rem 1.25rem; border: none; background: none; color: #acaab1; font-family: 'Space Grotesk', sans-serif; font-size: .8125rem; }
.k-btn--wl-nudge-signin:hover  { background: rgba(109,221,255,.2); color: #6dddff; }
.k-btn--wl-nudge-register:hover { color: #f9f5fd; }

/* Bulk toolbar */
.k-wl-toolbar {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
    gap: 1rem; padding: 1rem 1.25rem; border-radius: 12px; margin-bottom: 2rem;
    background: rgba(31,31,38,.6);
    backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(72,71,77,.1);
}
/* gap aligné sur .k-wl-toolbar__right (.75rem) pour un espacement cohérent
   entre les deux moitiés de la barre d'outils. */
.k-wl-toolbar__left { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.k-wl-toolbar__right { display: flex; align-items: center; gap: .75rem; }
.k-wl-toolbar__select-all {
    display: flex; align-items: center; gap: .5rem; cursor: pointer;
    color: #acaab1; font-family: 'Inter', sans-serif; font-size: .875rem;
    padding: .5rem .875rem; transition: color .15s;
}
.k-wl-toolbar__select-all:hover { color: #f9f5fd; }
.k-wl-cb { width: 18px; height: 18px; border-radius: 4px; border: 1px solid #48474d; background: #000; accent-color: #6dddff; cursor: pointer; flex-shrink: 0; }
.k-wl-toolbar__sort-label { font-family: 'Inter', sans-serif; font-size: .875rem; color: #acaab1; white-space: nowrap; }
.k-wl-sort {
    background: #000; border: none; color: #f9f5fd;
    border-radius: 8px; font-family: 'Inter', sans-serif;
    font-size: .875rem; padding: .375rem .75rem; min-width: 160px; cursor: pointer;
}
.k-wl-sort:focus { outline: 2px solid rgba(109,221,255,.3); outline-offset: 2px; }

/* Grid / List containers */
.k-wl-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1.5rem; margin-bottom: 2.5rem; }
.k-wl-grid--list { grid-template-columns: 1fr; gap: .75rem; }

/* Wishlist card — base */
.k-wl-card {
    background: #131319; border-radius: 12px; overflow: hidden;
    transition: transform .3s ease; position: relative;
    display: flex; flex-direction: column;
}
.k-wl-card:hover { transform: translateY(-4px); }

/* Checkbox — direct child of .k-wl-card (grid: overlays image; list: strip) */
.k-wl-card__cb {
    position: absolute; top: .75rem; left: .75rem; z-index: 3;
    width: 18px; height: 18px; border-radius: 4px;
    accent-color: #6dddff; cursor: pointer; backdrop-filter: blur(4px);
}

/* Image area */
.k-wl-card__media { position: relative; height: 256px; overflow: hidden; background: #0a0a0f; flex-shrink: 0; }
.k-wl-card__img-link { display: block; width: 100%; height: 100%; }
.k-wl-card__img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; will-change: transform; }
.k-wl-card:hover .k-wl-card__img { transform: scale(1.08); }

/* Sale badge */
.k-wl-card__badge {
    position: absolute; top: .625rem; left: 2.25rem; z-index: 2;
    background: linear-gradient(135deg, #6dddff, #00c3eb); color: #004c5e;
    font-family: 'Space Grotesk', sans-serif; font-size: .6875rem; font-weight: 700;
    padding: 2px 7px; border-radius: 4px;
}

/* Remove × */
.k-wl-card__remove {
    position: absolute; top: .625rem; right: .625rem; z-index: 4;
    display: flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; border-radius: 9999px;
    background: rgba(14,14,19,.65);
    border: 1px solid rgba(255,255,255,.08);
    color: rgba(232,232,237,.55);
    cursor: pointer;
    backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
    box-shadow: 0 2px 10px rgba(0,0,0,.45);
    transition: color .2s, background .2s, border-color .2s, transform .15s;
    opacity: 0;
}
.k-wl-card:hover .k-wl-card__remove { opacity: 1; }
.k-wl-card__remove:hover {
    color: #ff716c;
    background: rgba(255,59,92,.15);
    border-color: rgba(255,59,92,.35);
    transform: scale(1.08);
}

/* Card body */
.k-wl-card__body { padding: 1.25rem; display: flex; flex-direction: column; gap: .625rem; flex: 1; }

/* Chips */
.k-wl-card__chips { display: flex; flex-wrap: wrap; gap: .375rem; }
.k-wl-card__brand-chip {
    font-family: 'Space Grotesk', sans-serif; font-size: .625rem; font-weight: 700;
    letter-spacing: .1em; text-transform: uppercase;
    color: #6dddff; border: 1px solid rgba(109,221,255,.2); border-radius: 4px; padding: 2px 6px;
}
.k-wl-card__spec-chip {
    display: inline-flex; align-items: center; gap: .25rem;
    font-family: 'Inter', sans-serif; font-size: .625rem; font-weight: 500;
    background: #2c2b33; color: #acaab1; border-radius: 4px; padding: 2px 6px; white-space: nowrap;
}
.k-wl-card__spec-label {
    font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
    color: #76747b; font-size: .55rem;
}

/* Title */
.k-wl-card__title { font-family: 'Inter', sans-serif; font-size: 1rem; font-weight: 600; color: #f9f5fd; margin: 0; line-height: 1.35; transition: color .15s; }
.k-wl-card:hover .k-wl-card__title { color: #6dddff; }
.k-wl-card__title a { color: inherit; text-decoration: none; }

/* Price row */
.k-wl-card__price-row { display: flex; align-items: baseline; flex-wrap: wrap; gap: .25rem .625rem; }
.k-wl-card__price { font-family: 'Space Grotesk', sans-serif; font-size: 1.5rem; font-weight: 700; color: #6dddff; text-shadow: 0 0 8px rgba(109,221,255,.4); }
.k-wl-card__price-old { font-family: 'Inter', sans-serif; font-size: .875rem; color: #76747b; text-decoration: line-through; }

/* Stock row */
.k-wl-card__stock-row { display: flex; align-items: center; justify-content: space-between; }
.k-wl-card__stock {
    display: inline-flex; align-items: center;
    font-family: 'Space Grotesk', sans-serif; font-size: .625rem; font-weight: 900;
    text-transform: uppercase; letter-spacing: .08em;
    padding: .25rem .625rem; border-radius: 9999px;
}
.k-wl-card__stock--in  { background: rgba(164,255,185,.1); color: #a4ffb9; }
.k-wl-card__stock--out { background: rgba(255,113,108,.1);  color: #ff716c; }
.k-wl-card__price-drop { font-family: 'Space Grotesk', sans-serif; font-size: .75rem; font-weight: 700; color: #9f8eff; }

/* Card CTAs */
.k-btn--wl-card-cta {
    display: block; width: 100%; padding: .75rem; border-radius: 8px;
    border: 1px solid rgba(109,221,255,.2); background: rgba(109,221,255,.1); color: #6dddff;
    font-family: 'Space Grotesk', sans-serif; font-size: .875rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .05em; cursor: pointer;
    transition: background .3s, color .3s, border-color .3s;
    text-align: center; text-decoration: none; margin-top: auto;
}
.k-btn--wl-card-cta:hover { background: #6dddff; color: #004c5e; border-color: #6dddff; }
.k-btn--wl-card-disabled {
    display: block; width: 100%; padding: .75rem; border-radius: 8px;
    border: none; background: #25252d; color: #76747b;
    font-family: 'Space Grotesk', sans-serif; font-size: .875rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .05em; cursor: not-allowed; margin-top: auto;
}

/* List mode overrides */
.k-wl-grid--list .k-wl-card { flex-direction: row; transform: none !important; }
.k-wl-grid--list .k-wl-card:hover { background: #19191f; }
.k-wl-grid--list .k-wl-card__media { width: 120px; min-width: 120px; height: auto; min-height: 120px; border-radius: 0; flex-shrink: 0; }
.k-wl-grid--list .k-wl-card:hover .k-wl-card__img { transform: none; }
/* Checkbox floats in the 2.5rem left strip, vertically centred */
/* Checkbox overlays media left side in list mode — same pattern as remove btn */
.k-wl-grid--list .k-wl-card__cb { top: 50%; left: .5rem; transform: translateY(-50%); }
.k-wl-grid--list .k-wl-card__badge { top: auto; bottom: .5rem; }
.k-wl-grid--list .k-wl-card__body { flex-direction: row; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; padding: 1rem 1.25rem; }
.k-wl-grid--list .k-wl-card__chips  { flex: 0 0 100%; }
.k-wl-grid--list .k-wl-card__title  { flex: 1 1 200px; }
.k-wl-grid--list .k-wl-card__price-row { flex-shrink: 0; }
.k-wl-grid--list .k-wl-card__stock-row { flex: 0 0 auto; justify-content: flex-start; gap: .5rem; }
.k-wl-grid--list .k-btn--wl-card-cta,
.k-wl-grid--list .k-btn--wl-card-disabled { width: auto; padding: .5rem 1.25rem; flex-shrink: 0; margin-top: 0; }
.k-wl-grid--list .k-wl-card__remove { position: absolute; top: .5rem; right: .5rem; width: 26px; height: 26px; }

/* Variant D — Empty state */
.k-wl-empty { position: relative; text-align: center; padding: 5rem 1rem 4rem; overflow: hidden; }
.k-wl-empty__glow {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
    width: 500px; height: 500px; border-radius: 50%;
    background: radial-gradient(circle, rgba(159,142,255,.1) 0%, transparent 70%);
    filter: blur(60px); pointer-events: none; z-index: 0;
}
.k-wl-empty__icon {
    position: relative; z-index: 1;
    display: inline-flex; align-items: center; justify-content: center;
    width: 144px; height: 144px; border-radius: 50%;
    background: rgba(159,142,255,.08); margin-bottom: 1.5rem;
    filter: drop-shadow(0 0 15px rgba(109,221,255,.3));
    overflow: hidden;
}
/* Visuel par défaut du thème (assets/images/empty.jpg) — fond sombre intégré,
   cadré en médaillon ; le drop-shadow du conteneur fournit l'underglow néon. */
.k-wl-empty__icon img {
    display: block; width: 100%; height: 100%;
    object-fit: cover; border-radius: 50%;
}
.k-wl-empty__title {
    position: relative; z-index: 1;
    font-family: 'Space Grotesk', sans-serif; font-size: clamp(1.75rem, 4vw, 2.75rem);
    font-weight: 700; color: #f9f5fd; margin: 0 0 1rem; letter-spacing: -.02em;
}
.k-wl-empty__text {
    position: relative; z-index: 1;
    font-family: 'Inter', sans-serif; font-size: 1rem; color: #acaab1;
    max-width: 480px; margin: 0 auto 2.5rem; line-height: 1.65;
}
.k-wl-empty__actions { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; gap: 1rem; flex-wrap: wrap; }

/* Sign-in nudge */
.k-wl-nudge {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
    gap: 1rem; padding: 1.25rem 1.5rem; border-radius: 12px;
    background: #1f1f26; border-left: 4px solid rgba(109,221,255,.4); margin-bottom: 4rem;
}
.k-wl-nudge__left { display: flex; align-items: center; gap: 1rem; flex: 1; min-width: 0; }
.k-wl-nudge__left p { font-family: 'Inter', sans-serif; font-size: .9375rem; color: #f9f5fd; margin: 0; font-weight: 500; line-height: 1.5; }
.k-wl-nudge__actions { display: flex; align-items: center; gap: .75rem; flex-shrink: 0; }

/* Trending section */
.k-wl-trending { margin-top: 2rem; margin-bottom: 3rem; }
.k-wl-trending__sep { display: flex; align-items: center; gap: 1rem; margin-bottom: 0; }
.k-wl-trending__line { flex: 1; height: 1px; background: linear-gradient(90deg, transparent, rgba(109,221,255,.3), transparent); }
.k-wl-trending__label {
    font-family: 'Space Grotesk', sans-serif; font-size: .6875rem; font-weight: 700;
    letter-spacing: .3em; text-transform: uppercase; color: #6dddff;
    white-space: nowrap; padding: 0 1rem;
}
.k-wl-trending__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
    padding: 0 0.25rem;
}
.k-wl-trending__glow-line {
    width: 100%; height: 2px;
    background: linear-gradient(90deg, transparent, rgba(109,221,255,.4), transparent);
    box-shadow: 0 0 20px rgba(109,221,255,.3);
}

/* Footer hint */
.k-wl-footer-hint { font-family: 'Inter', sans-serif; font-size: .8125rem; color: #48474d; text-align: center; margin-top: 1.5rem; }
.k-wl-footer-hint a { color: #9f8eff; text-decoration: none; }
.k-wl-footer-hint a:hover { text-decoration: underline; }

/* Responsive */
@media (max-width: 1024px) {
    /* :not(--list) : la vue liste reste une colonne unique (cartes-rangées
       pleine largeur) à toute largeur. Sans ça, .k-wl-grid générique écrase
       .k-wl-grid--list{1fr} et la liste passe en 2 col sur tablette. */
    .k-wl-grid:not(.k-wl-grid--list) { grid-template-columns: repeat(2,1fr); gap: 1.5rem; }
    .k-wl-trending__grid { grid-template-columns: repeat(2,1fr); gap: 1.25rem; }
}
@media (max-width: 768px) {
    .k-wl-header { flex-direction: column; align-items: flex-start; }
    .k-wl-header__title { font-size: 2rem; }
    .k-wl-toolbar { flex-direction: column; align-items: flex-start; }
    .k-wl-nudge { flex-direction: column; }
    .k-wl-nudge__actions { width: 100%; }
    .k-wl-grid--list .k-wl-card__media { width: 90px; min-width: 90px; min-height: 90px; }
    .k-wl-grid--list .k-wl-card__body  { gap: .375rem .75rem; padding: .75rem; }
}
@media (max-width: 560px) {
    /* même sélecteur :not(--list) que le bloc 1024px ⇒ spécificité égale,
       c'est l'ordre source (ce bloc, plus bas) qui tranche : 1 col ≤560px. */
    .k-wl-grid:not(.k-wl-grid--list) { grid-template-columns: 1fr; gap: 1rem; }
    .k-wl-trending__grid { grid-template-columns: 1fr 1fr; gap: 1rem; }
    .k-wl-grid--list .k-wl-card { flex-direction: column; }
    .k-wl-grid--list .k-wl-card__media { width: 100%; min-width: 0; height: 160px; border-radius: 12px 12px 0 0; }
    .k-wl-grid--list .k-btn--wl-card-cta,
    .k-wl-grid--list .k-btn--wl-card-disabled { width: 100%; }
}

/* ---------- Light mode ---------- */
html[data-theme="light"] .k-wishlist-page {
    background: var(--k-background);
}
html[data-theme="light"] .k-wl-grid--list .k-wl-card:hover {
    background: var(--k-surface-2);
}
html[data-theme="light"] .k-wl-view-toggle {
    background: var(--k-surface-2);
    border: 1px solid var(--k-hairline);
}
html[data-theme="light"] .k-wl-view-btn {
    color: var(--k-muted);
}
html[data-theme="light"] .k-wl-view-btn.is-active,
html[data-theme="light"] .k-wl-view-btn:hover {
    background: var(--k-surface);
    color: var(--k-text);
}
html[data-theme="light"] .k-wl-header__title {
    color: var(--k-text);
}
html[data-theme="light"] .k-wl-card {
    background: var(--k-surface);
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
html[data-theme="light"] .k-wl-card__media {
    background: var(--k-surface-2);
}
html[data-theme="light"] .k-wl-card__title {
    color: var(--k-text);
}
html[data-theme="light"] .k-wl-card:hover .k-wl-card__title {
    color: var(--kp-cyan, #00A8CC);
}
html[data-theme="light"] .k-wl-toolbar {
    background: rgba(244,244,248,0.85);
    border-color: var(--k-hairline);
}
html[data-theme="light"] .k-wl-sort {
    background: var(--k-surface-2);
    color: var(--k-text);
    border: 1px solid var(--k-hairline);
}
html[data-theme="light"] .k-wl-toolbar__select-all {
    color: var(--k-muted);
}
html[data-theme="light"] .k-wl-toolbar__select-all:hover {
    color: var(--k-text);
}
html[data-theme="light"] .k-wl-cb {
    background: var(--k-surface);
    border-color: var(--k-hairline);
}
html[data-theme="light"] .k-wl-empty {
    background: rgba(var(--k-glass-rgb), 0.7);
    border-color: var(--k-hairline);
}
html[data-theme="light"] .k-wl-empty__title {
    color: var(--k-text);
}
/* Le visuel empty.jpg garde son fond sombre intégré : anneau fantôme +
   glow adouci pour l'asseoir sur fond clair. */
html[data-theme="light"] .k-wl-empty__icon {
    box-shadow: 0 0 0 1px rgba(72, 71, 77, .15);
    filter: drop-shadow(0 0 18px rgba(0, 180, 255, .22));
}
html[data-theme="light"] .k-wl-nudge {
    background: var(--k-surface);
    border-color: var(--k-hairline);
}
html[data-theme="light"] .k-wl-nudge p {
    color: var(--k-muted);
}
html[data-theme="light"] .k-wl-footer-hint {
    color: var(--k-muted);
}

/* ── Mobile touch targets ─────────────────────────────────────────── */
@media (max-width: 768px) {
    /* Toolbar checkbox — keep the native control compact (18px, hérité de
       la base). On NE grossit PAS l'<input> : la zone tactile de 44px est
       portée par le label .k-wl-toolbar__select-all (min-height + padding). */

    /* Card checkbox — léger bump tactile (22px), maintenu à l'écart du
       badge promo (.k-wl-card__badge à left:2.25rem). 8px + 22px = 30px
       < 36px ⇒ aucun chevauchement. */
    .k-wl-card__cb {
        width: 22px;
        height: 22px;
        top: .5rem;
        left: .5rem;
    }

    /* List view 561-768px : carte en LIGNE (média = bande gauche) ⇒ case
       centrée verticalement sur la bande. Override colonne ≤560px plus bas. */
    .k-wl-grid--list .k-wl-card__cb {
        top: 50%;
        left: .5rem;
        transform: translateY(-50%);
    }

    /* Toolbar Select-all button — ensure 44px height */
    .k-wl-toolbar__select-all {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
    }

    /* View toggle buttons — 44×44 minimum */
    .k-wl-view-toggle__btn {
        min-width: 44px;
        min-height: 44px;
    }

    /* CTA buttons on card */
    .k-btn--wl-card-cta,
    .k-btn--wl-card-disabled {
        min-height: 44px;
    }

    /* NB : la grille suit la cascade d'origine — 2 col 561-1024px, puis
       1 col ≤560px (voir @media max-width:560px). On ne force PAS 2 colonnes
       ici : à 390px (iPhone 12) deux cartes de ~155px rognent le prix barré
       et les chips de specs. Une colonne pleine largeur reste lisible. */
}

/* ≤560px : la carte liste passe en COLONNE (média pleine largeur en haut,
   body dessous — voir @media max-width:560px). Le top:50% du bloc touch
   centrerait alors la case sur le body. On la replace dans le coin haut-
   gauche du média, comme en grille. Placé après le bloc touch pour gagner
   en ordre source (même spécificité). */
@media (max-width: 560px) {
    .k-wl-grid--list .k-wl-card__cb {
        top: .5rem;
        left: .5rem;
        transform: none;
    }
}

/* =========================================================
   WCAG AA — Focus rings (wishlist-specific interactive elements)
   ========================================================= */

/* View-mode toggle (grid / list) */
.k-wl-view-btn:focus-visible {
    outline: 2px solid rgba(0, 212, 255, 0.8);
    outline-offset: 2px;
    border-radius: 4px;
}

/* Remove-from-wishlist button */
.k-wl-card__remove:focus-visible {
    outline: 2px solid rgba(0, 212, 255, 0.8);
    outline-offset: 3px;
    border-radius: 50%;
}

/* Wishlist sort select */
.k-wl-sort:focus-visible {
    outline: 2px solid rgba(0, 212, 255, 0.7);
    outline-offset: 2px;
    border-radius: 4px;
}

/* Wishlist toolbar action buttons (bulk remove, move) */
.k-btn--wl-danger:focus-visible,
.k-btn--wl-secondary:focus-visible,
.k-btn--wl-primary:focus-visible {
    outline: 2px solid rgba(0, 212, 255, 0.8);
    outline-offset: 3px;
}

/* Light-mode overrides */
html[data-theme="light"] .k-wl-view-btn:focus-visible,
html[data-theme="light"] .k-wl-card__remove:focus-visible,
html[data-theme="light"] .k-wl-sort:focus-visible {
    outline-color: rgba(0, 153, 187, 0.9);
}

/* ---------- Pagination (rendue par wishlist.js au-delà de 8 produits) ---------- */
/* Cartes hors page courante — l'id bat .k-wl-grid--list .k-wl-card (0,2,0). */
#k-wl-grid .k-wl-card--off { display: none; }

.k-wl-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 2.5rem;
}
.k-wl-pagination__btn {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #19191f;
    color: var(--k-muted, #8b8b9e);
    font-family: 'Space Grotesk', sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1;
    border: 1px solid rgba(232, 232, 237, 0.07);
    cursor: pointer;
    transition: color 0.18s ease, background 0.18s ease,
                border-color 0.18s ease, box-shadow 0.18s ease;
}
.k-wl-pagination__btn:hover:not(:disabled):not(.is-current) {
    color: var(--k-cyan, #00d4ff);
    background: rgba(0, 212, 255, 0.08);
    border-color: rgba(0, 212, 255, 0.25);
    box-shadow: 0 0 18px rgba(0, 212, 255, 0.15);
}
.k-wl-pagination__btn.is-current {
    background: var(--k-cyan, #00d4ff);
    color: #0a0a0f;
    font-weight: 700;
    border-color: transparent;
    cursor: default;
}
.k-wl-pagination__btn:disabled {
    opacity: 0.35;
    cursor: default;
}
.k-wl-pagination__btn:focus-visible {
    outline: 2px solid rgba(0, 212, 255, 0.9);
    outline-offset: 2px;
}

html[data-theme="light"] .k-wl-pagination__btn {
    background: var(--k-surface-2);
    color: var(--k-muted);
    border-color: var(--k-hairline);
}
html[data-theme="light"] .k-wl-pagination__btn.is-current {
    background: var(--k-cyan, #00d4ff);
    color: #0a0a0f;
}
html[data-theme="light"] .k-wl-pagination__btn:focus-visible {
    outline-color: rgba(0, 153, 187, 0.9);
}