body{
  font-family:Arial,sans-serif;
  max-width:700px;
  margin:auto;
  padding:12px;
  background:#f7f7f7;
}

h1{
  color:#2e7d32;
  margin:0;
}

/* 顶部 */
.header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin:8px 0 10px;
}

.actions button{
  margin-left:6px;
}

/* 搜索 */
#searchInput{
  width:100%;
  padding:8px;
  border-radius:6px;
  border:1px solid #ddd;
  margin:6px 0;
}

/* =========================
   ⭐ 菜单整体：横向流布局
========================= */
#menu{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

/* =========================
   ⭐ 分类卡片（关键）
   - 不再占整行
   - 变成“半透明分组容器”
========================= */
.card{
  background:#fff;
  padding:8px;
  border-radius:10px;
  box-shadow:0 1px 2px rgba(0,0,0,0.06);

  display:flex;
  flex-wrap:wrap;
  gap:6px;

  align-items:flex-start;
}

/* 分类标题单独一行 */
.card-title{
  width:100%;
  font-size:18px;
  font-weight:bold;
  color:#000;
  margin:2px 0 4px;
}

/* =========================
   ⭐ 每道菜（标签化）
========================= */
.item-row{
  display:flex;
  align-items:center;
  gap:6px;

  padding:4px 8px;
  background:#fdfdfd;
  border:1px solid #eee;
  border-radius:6px;

  white-space:nowrap;
}

/* 左侧内容 */
.item-left{
  display:flex;
  align-items:center;
  gap:6px;
}

/* checkbox */
.item-left input{
  width:14px;
  height:14px;
  margin:0;
}

/* 菜名 */
.item-left span{
  font-size:13px;
  cursor:pointer;
}

/* =========================
   ⭐ 删除按钮
========================= */
.del-btn{
  display:none;
  color:#e53935;
  cursor:pointer;
  margin-left:4px;
  font-size:14px;
}

/* 编辑模式才显示删除 */
.edit-mode .del-btn{
  display:inline;
}

/* =========================
   ⭐ 已选区域
========================= */
#selected{
  background:#fff;
  padding:10px;
  border-radius:8px;
  margin-top:10px;
  list-style:none;
}

/* 已选项 */
#selected li{
  padding:2px 0;
  font-size:13px;
}