<!-- 菜谱详情 -->
<view class="container" wx:if="{{recipe}}">
  <view class="recipe-header">
    <text class="detail-name">{{recipe.name}}</text>
    <text class="detail-desc">{{recipe.description}}</text>
    <view class="detail-meta">
      <text class="tag">⏱ {{recipe.cooking_time}}分钟</text>
      <text class="tag">🔥 {{recipe.difficulty === 1 ? '简单' : (recipe.difficulty === 2 ? '中等' : '复杂')}}</text>
      <text class="tag" wx:for="{{recipe.tags}}" wx:key="*this">{{item}}</text>
    </view>
  </view>

  <!-- 食材清单 -->
  <view class="card">
    <text class="card-title">🥬 所需食材</text>
    <view class="ing-list">
      <text class="ing-item" wx:for="{{recipe.ingredients}}" wx:key="*this">
        {{item}}
        <text class="text-green" wx:if="{{matchedSet.indexOf(item) > -1}}"> ✅已有</text>
        <text class="text-danger" wx:else> ❌需购买</text>
      </text>
    </view>
  </view>

  <!-- 步骤 -->
  <view class="card">
    <text class="card-title">📝 做法</text>
    <view class="step-list">
      <view class="step-item" wx:for="{{recipe.steps}}" wx:key="*this">
        <text class="step-num">{{index + 1}}</text>
        <text class="step-text">{{item}}</text>
      </view>
    </view>
  </view>

  <!-- 冲突 -->
  <view class="card conflict-card" wx:if="{{conflicts.length}}">
    <text class="card-title">⚠️ 食材搭配提醒</text>
    <view class="conflict-item" wx:for="{{conflicts}}" wx:key="id">
      <text class="text-danger">{{item.food_a}} + {{item.food_b}}</text>
      <text class="text-muted">{{item.description}}</text>
    </view>
  </view>
</view>
