.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 50vh;
    text-align: center;
  
    .empty-icon {
      font-size: 64px;
      margin-bottom: 16px;
      opacity: 0.5;
    }
  }
  
  .compact-item {
    --padding-start: 8px;
    --inner-padding-end: 8px;
    margin-bottom: 8px;
    border-radius: 8px;
    border: 1px solid var(--ion-color-light-shade);
    
    h3 {
      font-weight: 500;
      margin-bottom: 4px;
    }
    
    .description {
      color: var(--ion-color-medium);
      font-size: 0.875rem;
      margin-bottom: 6px;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    
    .meta-info {
      display: flex;
      align-items: center;
      font-size: 0.75rem;
      color: var(--ion-color-medium);
      
      ion-icon {
        font-size: 0.875rem;
        margin-right: 2px;
      }
      
      .rating {
        margin-right: 12px;
        display: flex;
        align-items: center;
      }
      
      .time {
        display: flex;
        align-items: center;
      }
    }
  }.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 50vh;
    text-align: center;
  
    .empty-icon {
      font-size: 64px;
      margin-bottom: 16px;
      opacity: 0.5;
    }
  }
  
  .compact-item {
    --padding-start: 8px;
    --inner-padding-end: 8px;
    margin-bottom: 8px;
    border-radius: 8px;
    border: 1px solid var(--ion-color-light-shade);
    
    h3 {
      font-weight: 500;
      margin-bottom: 4px;
    }
    
    .description {
      color: var(--ion-color-medium);
      font-size: 0.875rem;
      margin-bottom: 6px;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    
    .meta-info {
      display: flex;
      align-items: center;
      font-size: 0.75rem;
      color: var(--ion-color-medium);
      
      ion-icon {
        font-size: 0.875rem;
        margin-right: 2px;
      }
      
      .rating {
        margin-right: 12px;
        display: flex;
        align-items: center;
      }
      
      .time {
        display: flex;
        align-items: center;
      }
    }
  }