[data-theme="jellybean-dark"] {
  --cream:     #141414;
  --card:      #222;
  --card-done: #222;
  --ink:       #efefef;
  --muted:     #b0b0b0;
  --coral:     #e8623a;
  --teal:      #3ab5b0;
  --orange:    #f5a030;
  --blue:      #3a6bbf;
}

[data-theme="jellybean-dark"] h1 { color: var(--ink); }
[data-theme="jellybean-dark"] #ghost-btn img { filter: invert(1); }

[data-theme="jellybean-dark"] form#todo-form,
[data-theme="jellybean-dark"] .auth-field,
[data-theme="jellybean-dark"] .done-header { background: #222; }

[data-theme="jellybean-dark"] .check { background: #333; border-color: #444; }

[data-theme="jellybean-dark"] #due-picker,
[data-theme="jellybean-dark"] #color-picker,
[data-theme="jellybean-dark"] #settings-menu { background: #1e1e1e; border-color: #333; }

[data-theme="jellybean-dark"] .settings-item:hover { background: #2a2a2a; }
[data-theme="jellybean-dark"] .settings-divider { background: #2a2a2a; }

[data-theme="jellybean-dark"] .color-swatch.clear { background: #333; }

[data-theme="jellybean-dark"] .color-btn { display: flex; }

[data-theme="jellybean-dark"] #due-picker input[type="date"] { background: #2a2a2a; color: #efefef; border-color: #444; }

/* ── full-card jellybean colors — all 10 ─────────────────────────── */
[data-theme="jellybean-dark"] li[data-color="red"]    { background: #f54a00; }
[data-theme="jellybean-dark"] li[data-color="teal"]   { background: #00a2b0; }
[data-theme="jellybean-dark"] li[data-color="orange"] { background: #eb7000; }
[data-theme="jellybean-dark"] li[data-color="blue"]   { background: #3480e8; }
[data-theme="jellybean-dark"] li[data-color="green"]  { background: #2b8800; }
[data-theme="jellybean-dark"] li[data-color="purple"] { background: #a22be7; }
[data-theme="jellybean-dark"] li[data-color="pink"]   { background: #f01880; }
[data-theme="jellybean-dark"] li[data-color="yellow"] { background: #f0d000; }
[data-theme="jellybean-dark"] li[data-color="lime"]   { background: #93d80e; }
[data-theme="jellybean-dark"] li[data-color="gray"]   { background: #828e90; }

/* ── white text on colored cards ─────────────────────────────────── */
[data-theme="jellybean-dark"] li[data-color] .todo-text { color: #fff; }
[data-theme="jellybean-dark"] li[data-color] .add-due   { color: rgba(255,255,255,0.7); }
[data-theme="jellybean-dark"] li[data-color] .add-due:hover { color: #fff; }
[data-theme="jellybean-dark"] li[data-color] .due-label { color: rgba(255,255,255,0.85); font-weight: 700; }
[data-theme="jellybean-dark"] li[data-color] .delete    { color: rgba(255,255,255,0.5); }
[data-theme="jellybean-dark"] li[data-color] .delete:hover { color: #fff; }

/* yellow and lime are light — use dark text */
[data-theme="jellybean-dark"] li[data-color="yellow"] .todo-text,
[data-theme="jellybean-dark"] li[data-color="lime"]   .todo-text { color: rgba(0,0,0,0.75); }
[data-theme="jellybean-dark"] li[data-color="yellow"] .due-label,
[data-theme="jellybean-dark"] li[data-color="lime"]   .due-label { color: rgba(0,0,0,0.6); }

/* ── checkbox on colored cards ───────────────────────────────────── */
[data-theme="jellybean-dark"] li[data-color] .check {
  background: rgba(255,255,255,0.25);
  border-color: rgba(255,255,255,0.45);
}

[data-theme="jellybean-dark"] li[data-color].done .check {
  background: rgba(255,255,255,0.55);
  border-color: rgba(255,255,255,0.55);
}

/* color dot on colored cards: white circle */
[data-theme="jellybean-dark"] li[data-color] .color-btn {
  background: rgba(255,255,255,0.35) !important;
}

/* ── done state ──────────────────────────────────────────────────── */
[data-theme="jellybean-dark"] li.done .todo-text { color: var(--muted); }