.kss-bewertungen-item {
  grid-column: span 4 / span 4;
  border-radius: var(--kss-brand-border-radius-default, 16px);
  padding: calc(var(--kss-page-layout-gap, 2rem) * 0.75);
  min-height: 180px;
  display: flex;
  flex-direction: column;
  gap: calc(var(--kss-page-layout-gap, 2rem) * 0.5);
  background-color: #f5f5f5;
  /* Fallback, wird von Karten-Einstellungen überschrieben */
}

/* Responsive Spalten-Anpassung */
@media screen and (min-width: 1024px) {
  .kss-bewertungen[data-block-count="2"]>.kss-bewertungen-item {
    grid-column: span 6 / span 6;
  }

  .kss-bewertungen[data-block-count="4"]>.kss-bewertungen-item:last-child {
    grid-column: span 12;
  }

  .kss-bewertungen[data-block-count="5"]>.kss-bewertungen-item:last-child {
    grid-column: span 8 / span 8;
  }
}

/* Header-Bereich mit Bild und Text */
.kss-bewertungen-item__header {
  display: flex;
  gap: calc(var(--kss-page-layout-gap, 2rem) * 0.5);
}

/* Bild-Wrapper */
.kss-bewertungen-item__image-wrapper {
  flex-shrink: 0;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  overflow: hidden;
  background-color: #e0e0e0;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Bild selbst */
.kss-bewertungen-item__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Platzhalter wenn kein Bild - jetzt auch ein IMG */
.kss-bewertungen-item__image-placeholder {
  width: 100%;
  height: 100%;
  object-fit: contain;
  /* contain statt cover für SVG */
  display: flex;
  justify-content: center;
  align-self: end;
  opacity: 0.4;
  padding: 8px;
  /* Kleiner Abstand zum Rand */
}

.kss-bewertungen-item__image-placeholder img.emoji {
  height: 4em !important;
  width: 4em !important;
}

/* Header-Text-Bereich */
.kss-bewertungen-item__header-text {
  flex: 1;
  min-width: 0;
}

/* Name (Headline) */
.kss-bewertungen-item__name {
  margin: 0;
  font-size: 1.125rem;
  line-height: 1.3;
  font-weight: 600;
  color: var(--kss-color-black, #000);
}

/* Titel/Position */
.kss-bewertungen-item__title {
  font-size: 0.875rem;
  line-height: 1.3;
  color: var(--kss-muted, #667);
  font-weight: 400;
  margin: unset !important;
}

/* Bewertungstext */
.kss-bewertungen-item__text {
  margin: 0;
  color: var(--kss-color-text, #333);
  font-size: 0.95rem;
  line-height: 1.6;
  flex: 1;
  margin-top: 0.5rem;
  padding-left: 1rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  margin-left: 1rem;
  border-left: 2px solid #33333338;
}

/* Hover-Effekt */
.kss-bewertungen-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}

/* Im Slider-Modus volle Höhe nutzen */
.kss-bewertungen--slider .kss-bewertungen-item {
  height: 100%;
  margin-right: calc(var(--kss-page-layout-gap, 2rem) * 0.5);
}

/* Karten-Hintergründe */
.kss-bewertungen-item.has-card-bg-white {
  background-color: #ffffff;
}

.kss-bewertungen-item.has-card-bg-dark {
  background-color: var(--kss-color-black, #000);
  color: #ffffff;
}

.kss-bewertungen-item.has-card-bg-dark .kss-bewertungen-item__name {
  color: #ffffff;
}

.kss-bewertungen-item.has-card-bg-dark .kss-bewertungen-item__title {
  color: rgba(255, 255, 255, 0.7);
}

.kss-bewertungen-item.has-card-bg-dark .kss-bewertungen-item__text {
  color: rgba(255, 255, 255, 0.9);
    border-left: 2px solid var(--kss-color-white);
}

.kss-bewertungen-item.has-card-bg-primary {
  background-color: var(--kss-color-primary, #0073aa);
  color: #ffffff;
}

.kss-bewertungen-item.has-card-bg-primary .kss-bewertungen-item__name {
  color: #ffffff;
}

.kss-bewertungen-item.has-card-bg-primary .kss-bewertungen-item__title {
  color: rgba(255, 255, 255, 0.8);
}

.kss-bewertungen-item.has-card-bg-primary .kss-bewertungen-item__text {
  color: rgba(255, 255, 255, 0.95);
}

.kss-bewertungen-item.has-card-bg-secondary {
  background-color: var(--kss-color-secondary, #005177);
  color: #ffffff;
}

.kss-bewertungen-item.has-card-bg-secondary .kss-bewertungen-item__name {
  color: #ffffff;
}

.kss-bewertungen-item.has-card-bg-secondary .kss-bewertungen-item__title {
  color: rgba(255, 255, 255, 0.8);
}

.kss-bewertungen-item.has-card-bg-secondary .kss-bewertungen-item__text {
  color: rgba(255, 255, 255, 0.95);
}

.kss-bewertungen-item.has-card-bg-custom {
  background-color: var(--card-background-color, #f5f5f5);
}

/* Akzentfarben */
.kss-bewertungen-item.has-accent-primary .kss-bewertungen-item__name {
  color: var(--kss-color-primary, #0073aa);
}

.kss-bewertungen-item.has-accent-secondary .kss-bewertungen-item__name {
  color: var(--kss-color-secondary, #005177);
}

.kss-bewertungen-item.has-accent-custom .kss-bewertungen-item__name {
  color: var(--accent-color, var(--kss-color-primary, #0073aa));
}

/* Rahmen */
.kss-bewertungen-item.has-card-border {
  border: var(--card-border-width, 1px) solid var(--card-border-color, #e0e0e0);
}

/* Schatten */
.kss-bewertungen-item.shadow-light {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.kss-bewertungen-item.shadow-medium {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.kss-bewertungen-item.shadow-strong {
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
}

/* Text-Abstände */
.kss-bewertungen-item.text-spacing-8 {
  gap: var(--card-text-spacing, 8px);
}

.kss-bewertungen-item.text-spacing-10 {
  gap: var(--card-text-spacing, 10px);
}

.kss-bewertungen-item.text-spacing-12 {
  gap: var(--card-text-spacing, 12px);
}

.kss-bewertungen-item.text-spacing-14 {
  gap: var(--card-text-spacing, 14px);
}

.kss-bewertungen-item.text-spacing-18 {
  gap: var(--card-text-spacing, 18px);
}

.kss-bewertungen-item.text-spacing-20 {
  gap: var(--card-text-spacing, 20px);
}

.kss-bewertungen-item.text-spacing-22 {
  gap: var(--card-text-spacing, 22px);
}

.kss-bewertungen-item.text-spacing-24 {
  gap: var(--card-text-spacing, 24px);
}

.kss-bewertungen-item.text-spacing-26 {
  gap: var(--card-text-spacing, 26px);
}

.kss-bewertungen-item.text-spacing-28 {
  gap: var(--card-text-spacing, 28px);
}

.kss-bewertungen-item.text-spacing-30 {
  gap: var(--card-text-spacing, 30px);
}

.kss-bewertungen-item.text-spacing-32 {
  gap: var(--card-text-spacing, 32px);
}

/* Rating Sterne */
.kss-bewertungen-item__star {
  font-size: 0.75rem;
}