[data-theme="classic"] {
  --cream:     #c0c0c0;
  --card:      #ffffff;
  --card-done: #d0d0d0;
  --ink:       #000000;
  --muted:     #555555;
  --coral:     #000000;
  --teal:      #000000;
  --orange:    #000000;
  --blue:      #000000;
}

/* ── square corners everywhere ───────────────────────────────────── */
[data-theme="classic"] li,
[data-theme="classic"] form#todo-form,
[data-theme="classic"] .add-btn,
[data-theme="classic"] button[type="submit"],
[data-theme="classic"] .check,
[data-theme="classic"] #settings-menu,
[data-theme="classic"] #due-picker,
[data-theme="classic"] .status,
[data-theme="classic"] .done-header { border-radius: 0 !important; }

/* ── title bar ───────────────────────────────────────────────────── */
[data-theme="classic"] h1 {
  background: transparent;
  color: #000;
  border: 1px solid #000;
  box-shadow: 2px 2px 0 rgba(0,0,0,0.45);
  padding: 7px 12px;
  margin-bottom: 20px;
}

[data-theme="classic"] #title-text {
  display: flex;
  align-items: center;
  flex: 1;
  align-self: stretch;
}

[data-theme="classic"] .status { margin-left: 0; }

[data-theme="classic"] #title-text::after {
  content: '';
  flex: 1;
  height: 100%;
  background: repeating-linear-gradient(
    to bottom,
    #000 0px, #000 1px,
    transparent 1px, transparent 4px
  );
  margin-left: 8px;
}

/* ── cards — white windows with hard drop shadow ─────────────────── */
[data-theme="classic"] li {
  border: 1px solid #000;
  box-shadow: 2px 2px 0 rgba(0,0,0,0.45);
  background: #fff;
}

[data-theme="classic"] li.done {
  background: #cccccc;
  box-shadow: 2px 2px 0 rgba(0,0,0,0.3);
}

[data-theme="classic"] li.done .todo-text { color: #444; }

/* ── form ────────────────────────────────────────────────────────── */
[data-theme="classic"] form#todo-form {
  background: #fff;
  border: 1px solid #000;
  box-shadow: 2px 2px 0 rgba(0,0,0,0.45);
}

[data-theme="classic"] .auth-field {
  background: #fff;
  border: 1px solid #000;
}

/* ── checkbox — classic Mac square checkbox ──────────────────────── */
[data-theme="classic"] .check {
  background: #fff;
  border: 1px solid #000;
  border-radius: 0;
}

[data-theme="classic"] li.done .check {
  background: #000;
  border-color: #000;
}

[data-theme="classic"] li.done .check::after { border-color: #fff; }

/* ── done header ─────────────────────────────────────────────────── */
[data-theme="classic"] .done-header {
  background: #aaaaaa;
  border: 1px solid #000;
  color: #000;
  box-shadow: 2px 2px 0 rgba(0,0,0,0.35);
}

[data-theme="classic"] .done-header:hover { background: #999; }
[data-theme="classic"] .done-count { color: #000; }
[data-theme="classic"] .clear-done-btn { color: #333; }
[data-theme="classic"] .clear-done-btn:hover { color: #000; }

/* ── buttons ─────────────────────────────────────────────────────── */
[data-theme="classic"] .add-btn {
  background: #fff;
  color: #000;
  border: 1px solid #000;
  box-shadow: 2px 2px 0 rgba(0,0,0,0.5);
}
[data-theme="classic"] .add-btn:hover {
  background: #000;
  color: #fff;
  box-shadow: 1px 1px 0 rgba(0,0,0,0.5);
}

[data-theme="classic"] button[type="submit"] {
  background: #000;
  color: #fff;
  border: 1px solid #000;
  box-shadow: 2px 2px 0 rgba(0,0,0,0.5);
}
[data-theme="classic"] button[type="submit"]:hover { background: #333; }

/* ── status ──────────────────────────────────────────────────────── */
[data-theme="classic"] .status {
  border: 1px solid #000;
  box-shadow: 1px 1px 0 rgba(0,0,0,0.4);
}
[data-theme="classic"] .status.loading { background: #aaa; color: #444; }
[data-theme="classic"] .status.saving  { background: #666; color: #fff; }
[data-theme="classic"] .status.saved   { background: #000; color: #fff; }
[data-theme="classic"] .status.error   { background: #fff; color: #000; border: 2px solid #000; }
[data-theme="classic"] .status.offline { background: #888; color: #fff; }

/* ── pickers / menu ──────────────────────────────────────────────── */
[data-theme="classic"] #due-picker,
[data-theme="classic"] #color-picker,
[data-theme="classic"] #settings-menu {
  background: #fff;
  border: 1px solid #000;
  box-shadow: 3px 3px 0 rgba(0,0,0,0.4);
}

[data-theme="classic"] .settings-item:hover { background: #000; color: #fff; }
[data-theme="classic"] .settings-item:hover .settings-icon { color: #fff; }
[data-theme="classic"] .settings-item:hover span { color: #fff; }
[data-theme="classic"] .settings-icon { color: #666; }
[data-theme="classic"] .settings-divider { background: #000; height: 1px; }
[data-theme="classic"] .settings-credit { color: #999; }

[data-theme="classic"] #due-picker input[type="date"] {
  background: #fff;
  color: #000;
  border-color: #000;
}

/* ── due dates ───────────────────────────────────────────────────── */
[data-theme="classic"] .add-due { color: #aaa; }
[data-theme="classic"] .add-due:hover { color: #000; }
[data-theme="classic"] .due-label { color: #666; font-weight: 700; }
[data-theme="classic"] .due-label.overdue { color: #000; }
