/* Wünsche Manager – frontend, matches the pink card mockups */
.wm-wrap { --wm-pink:#f43f5e; --wm-pink-soft:#fff1f2; --wm-border:#f3e2e5; --wm-text:#3d3438; --wm-muted:#8a7d81; margin:1.5em 0; }

/* Toolbar */
.wm-toolbar { display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; margin-bottom:18px; }
.wm-chips { display:flex; flex-wrap:wrap; gap:8px; }
.wm-chip { border:1px solid var(--wm-border); background:#fff; color:var(--wm-text); border-radius:999px; padding:8px 18px; font-size:14px; cursor:pointer; transition:.15s; }
.wm-chip:hover { border-color:var(--wm-pink); color:var(--wm-pink); }
.wm-chip.is-active { background:var(--wm-pink); border-color:var(--wm-pink); color:#fff; }
.wm-sort { font-size:14px; color:var(--wm-muted); display:flex; align-items:center; gap:6px; }
.wm-sort-select { border:1px solid var(--wm-border); border-radius:8px; padding:6px 10px; font-size:14px; background:#fff; color:var(--wm-text); }

/* Cards */
.wm-list { display:flex; flex-direction:column; gap:14px; }
.wm-card { position:relative; background:#fff; border:1px solid var(--wm-border); border-radius:14px; padding:22px 24px 16px 52px; box-shadow:0 1px 3px rgba(244,63,94,.05); }
.wm-quote { position:absolute; left:22px; top:16px; font-size:30px; line-height:1; color:var(--wm-pink); font-family:Georgia,serif; }
.wm-text { margin:0 0 14px; font-size:16.5px; line-height:1.55; color:var(--wm-text); }
.wm-actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.wm-btn { display:inline-flex; align-items:center; gap:6px; background:none; border:none; color:var(--wm-muted); font-size:13.5px; cursor:pointer; padding:6px 10px; border-radius:8px; transition:.15s; }
.wm-btn:hover { background:var(--wm-pink-soft); color:var(--wm-pink); }
.wm-like.is-liked { color:var(--wm-pink); }
.wm-like.is-liked svg { fill:var(--wm-pink); }
.wm-btn.is-done { color:#16a34a; }

/* Load more */
.wm-more-wrap { text-align:center; margin-top:22px; }
.wm-more { background:#fff; border:1.5px solid var(--wm-pink); color:var(--wm-pink); border-radius:10px; padding:11px 28px; font-size:15px; cursor:pointer; transition:.15s; }
.wm-more:hover { background:var(--wm-pink); color:#fff; }
.wm-more[disabled] { opacity:.5; cursor:default; }

/* Stats bar */
.wm-stats { display:flex; flex-wrap:wrap; gap:28px; padding:16px 0; margin:1em 0; }
.wm-stat { display:flex; flex-direction:column; }
.wm-stat strong { font-size:20px; color:#3d3438; }
.wm-stat span { font-size:13px; color:#8a7d81; }

/* Image grid */
.wm-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; }
.wm-img-card { background:#fff; border:1px solid var(--wm-border); border-radius:14px; overflow:hidden; box-shadow:0 1px 3px rgba(244,63,94,.05); }
.wm-img-frame { position:relative; aspect-ratio:1/1; overflow:hidden; background:var(--wm-pink-soft); }
.wm-img-frame img { width:100%; height:100%; object-fit:cover; display:block; }
.wm-gif-badge { position:absolute; right:8px; bottom:8px; background:rgba(0,0,0,.65); color:#fff; font-size:11px; padding:2px 7px; border-radius:6px; letter-spacing:.5px; }
.wm-img-actions { justify-content:center; padding:8px 6px; }

/* Toast */
.wm-toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(10px); background:#3d3438; color:#fff; padding:10px 20px; border-radius:10px; font-size:14px; opacity:0; pointer-events:none; transition:.25s; z-index:9999; }
.wm-toast.is-show { opacity:1; transform:translateX(-50%) translateY(0); }

@media (max-width:600px){
  .wm-card { padding:18px 16px 12px 42px; }
  .wm-quote { left:14px; }
  .wm-toolbar { flex-direction:column; align-items:flex-start; }
}