/* ── Shopping list page shell ── */
.shopping-list {
  max-width: var(--content-width);
  margin: 0 auto;
  padding: var(--space-7);
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.shopping-list__toolbar {
  display: flex;
  align-items: center;
  gap: var(--space-4);
}

.shopping-list__toolbar .page-title {
  flex: 1;
  margin: 0;
}

.shopping-list__actions {
  display: flex;
  gap: var(--space-3);
  align-items: center;
  flex-wrap: wrap;
}

/* ── Category groups ── */
.shopping-list__group {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

/* ── Item list ── */
.shopping-list__items {
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-2xl);
  overflow: hidden;
  box-shadow: var(--shadow-md);
}

/* ── Single item row ── */
.shopping-list__item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
}

.shopping-list__item:nth-child(odd)  { background: var(--warm-white); }
.shopping-list__item:nth-child(even) { background: var(--cream); }
.shopping-list__item:nth-child(3n+1) { border-left: 5px solid var(--coral); }
.shopping-list__item:nth-child(3n+2) { border-left: 5px solid var(--maize-dk); }
.shopping-list__item:nth-child(3n)   { border-left: 5px solid var(--sage); }

.shopping-list__item-name {
  flex: 1;
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--ink);
}

.shopping-list__remove {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--ink-lt);
  line-height: 0;
  padding: var(--space-1);
  margin: 0;
  transition: color var(--duration-fast);
}

.shopping-list__remove:hover { color: var(--coral); }

/* ── Empty state ── */
.shopping-list__empty {
  text-align: center;
  padding: var(--space-12) var(--space-4);
  color: var(--ink-lt);
  font-size: var(--text-lg);
}

/* ── Manage (editable items) page ── */
.shopping-manage {
  max-width: var(--content-width);
  margin: 0 auto;
  padding: var(--space-7);
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.shopping-manage__toolbar {
  display: flex;
  align-items: center;
  gap: var(--space-4);
}

.shopping-manage__toolbar .page-title {
  flex: 1;
  margin: 0;
}

/* ── Editable item groups ── */
.editable-items__group {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.editable-items__header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
  padding: 0 var(--space-4) var(--space-1);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-lt);
}

.editable-items__rows {
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-2xl);
  overflow: hidden;
  box-shadow: var(--shadow-md);
}

.editable-items__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
  align-items: center;
  padding: var(--space-3) var(--space-4);
}

.editable-items__row:nth-child(odd)  { background: var(--warm-white); }
.editable-items__row:nth-child(even) { background: var(--cream); }
.editable-items__row:nth-child(3n+1) { border-left: 5px solid var(--coral); }
.editable-items__row:nth-child(3n+2) { border-left: 5px solid var(--maize-dk); }
.editable-items__row:nth-child(3n)   { border-left: 5px solid var(--sage); }

/* ── Mobile ── */
@media (max-width: 679px) {
  .shopping-list,
  .shopping-manage {
    padding: var(--space-4);
  }

  .shopping-list__actions { gap: var(--space-2); }
}