/* Interactions (Wechselwirkungen) UI helpers */
.ix-controls{
  background: var(--surface, #fff);
  border: 1px solid var(--border, #e0e5ee);
  border-radius: var(--radius-sm, 10px);
  padding: 14px;
}
.ix-label{
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--text-muted, #8896aa);
}
.ix-sub{ font-size: 12px; color: var(--text-muted, #8896aa); }
.ix-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-weight:900;
  padding:4px 10px;
  border-radius: 999px;
  font-size: 12px;
  white-space: nowrap;
  border: 1px solid transparent;
}
.ix-badge.level-2{ background: #fff7ed; border-color:#fdba74; color:#9a3412; } /* orange */
.ix-badge.level-3{ background: #fef9c3; border-color:#fde047; color:#854d0e; } /* yellow */
.ix-badge.level-4{ background: #ecfccb; border-color:#bef264; color:#365314; } /* green */
.ix-pill{
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .02em;
  color: var(--text-muted, #8896aa);
}
.ix-muted{ color: var(--text-muted, #8896aa); }

.ix-action-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap:10px;
}
.ix-action-card{
  border:1px solid var(--border, #e0e5ee);
  border-left:4px solid #f59e0b;
  border-radius:10px;
  padding:10px;
  background:#fff;
  color: #0f172a;
}
.ix-action-card.level-2{ border-left-color:#ea580c; background:#fff7ed; }
.ix-action-card.level-3{ border-left-color:#ca8a04; background:#fefce8; }
.ix-action-head{
  display:flex;
  justify-content:space-between;
  gap:8px;
  align-items:flex-start;
  margin-bottom:6px;
}
.ix-action-title{
  font-size:13px;
  font-weight:700;
  line-height:1.3;
  color: #111827;
}
.ix-action-meta{
  color: #334155;
  font-size: 12px;
  line-height: 1.4;
}
.ix-action-text{
  font-size:13px;
  margin-bottom:4px;
  color: #0f172a;
}

.ix-audience-toggle .btn{
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.ix-action-section-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.ix-action-audience{
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.ix-action-audience .ix-label{
  margin: 0;
}

.ix-audience-toggle .btn.active{
  background: #e8f1ff;
  border-color: #7aa2e3;
  color: #163a72;
}

.ix-fallback-hint{
  border: 1px dashed #d4af37;
  border-radius: 8px;
  background: #fffbe8;
  color: #725600;
  padding: 8px 10px;
  font-size: 12px;
}

.ix-fallback-chip{
  display: inline-flex;
  align-items: center;
  margin-left: 6px;
  padding: 1px 7px;
  border-radius: 999px;
  border: 1px solid #d4af37;
  background: #fffbe8;
  color: #725600;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

@media (max-width: 576px){
  .ix-action-audience{
    width: 100%;
    justify-content: space-between;
  }
}