/* =========================================================
   Enfold Post-Slider – Badge unten rechts, nur Text
   ========================================================= */

/* ===== Bezugspunkt sicherstellen: NUR der Bild-Wrapper ist relative ===== */
.avia-content-slider .slide-entry .av-image-container,
.avia-content-slider .slide-entry .slide-image,
.avia-content-slider .slide-entry .avia-slide-wrap {
  position: relative !important;
  overflow: visible;           /* Banner darf über den Inhalt ragen */
}

/* ===== Banner UNTEN im Bild, volle Breite, rechtsbündig ===== */
.avia-content-slider .slide-entry .td-banner-updated{
  position: absolute !important;
  left: .75rem;                 /* Abstand links */
  right: .75rem;                /* Abstand rechts */
  bottom: .75rem;               /* Abstand unten */
  top: auto !important;

  z-index: 6;
  pointer-events: none;
  text-align: right;            /* alles rechtsbündig */
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;

  /* volle Breite innerhalb der Abstände */
  box-sizing: border-box;

  /* saubere Umbrüche (auch iOS) */
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: auto;
}

/* (Optional) RTL: unten links statt rechts */
.rtl .avia-content-slider .slide-entry .td-banner-updated{
  left: .75rem !important;
  right: .75rem !important;
  text-align: left;
}

/* Mobile: gleiche Logik, nur etwas engere Abstände */
@media (max-width: 480px){
  .avia-content-slider .slide-entry .td-banner-updated{
    left: .5rem;
    right: .5rem;
    bottom: .5rem;
  }
}

/* ===== Inhalt: inline-block, damit rechtsbündig + Umbruch sauber klappt ===== */
.avia-content-slider .slide-entry .td-banner-updated .td-badge{
  display: inline-block;
  max-width: 100%;
  margin: 0;
  padding: 0;

  color: var(--hell, #fff);
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.3;

  text-shadow:
    0 1px 2px rgba(0,0,0,0.65),
    0 0 6px rgba(0,0,0,0.40);

  white-space: normal;    /* Umbruch erlaubt */
}

/* ===== "Neu" (Small Caps + größerer Anfangsbuchstabe) ===== */
.avia-content-slider .slide-entry .td-banner-updated .td-badge .td-new{
  font-variant: small-caps;
  font-weight: 900;
  letter-spacing: 0.5px;
  color: #fb0308;
  text-transform: uppercase;    /* Small-Caps-Fallback */
  margin-right: .6em;
  white-space: nowrap;          /* "Neu" bleibt zusammen */
  display: inline-block;
}

/* jetzt greift die Initiale */
.avia-content-slider .slide-entry .td-banner-updated .td-badge .td-new::first-letter{
  font-size: 1.35em !important;
  line-height: 1;
}

/* ===== Datum: darf umbrechen, trotzdem rechtsbündig ===== */
.avia-content-slider .slide-entry .td-banner-updated .td-badge .td-date{
  display: inline;
  font-size: .9em;
  opacity: .9;
  white-space: normal;          /* NICHT nowrap – sonst Überlauf */
  text-align: right;
}

/* ===== RTL: unten links ===== */
.rtl .avia-content-slider .slide-entry .td-banner-updated{
  inset: auto auto 1rem 1rem;   /* rechts:auto, links:1rem */
  text-align: left;
}

/* ===== Mobile Tweaks (iPhone etc.) ===== */
@media (max-width: 480px){
  .avia-content-slider .slide-entry .td-banner-updated{
    inset: auto .75rem .75rem auto;
    max-width: min(94%, calc(100% - 1.5rem));
  }
  .avia-content-slider .slide-entry .td-banner-updated .td-badge{
    font-size: .95rem;          /* etwas kleiner */
  }
  .avia-content-slider .slide-entry .td-banner-updated .td-badge .td-new{
    margin-right: .5em;
  }
}

/* Runde Ecken Reparieren bei SLIDER */
.avia-content-slider .slide-entry .slide-image > img,
.home .slide-entry .slide-image picture > img {
  border-radius: var(--radius-small) !important;
}

/* =========================================================
   Blog-Hero – Badge unten rechts, identisch zum Post-Slider
   ========================================================= */

/* Bezugspunkt */
.blog-hero .post-entry .slide-image {
  position: relative !important;
  overflow: visible; /* Banner darf über den Rand schauen */
}

/* ===== Banner unten rechts, volle Breite, rechtsbündig ===== */
.blog-hero .td-banner-updated {
  position: absolute !important;
  left: .75rem;               /* Abstand links */
  right: .75rem;              /* Abstand rechts */
  bottom: .75rem;             /* Abstand unten */
  top: auto !important;

  z-index: 6;
  pointer-events: none;
  text-align: right;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;

  box-sizing: border-box;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: auto;
}

/* RTL-Variante: unten links */
.rtl .blog-hero .td-banner-updated {
  left: .75rem !important;
  right: .75rem !important;
  text-align: left;
}

/* Inhalt: inline-block für sauberes rechtsbündiges Layout */
.blog-hero .td-banner-updated .td-badge {
  display: inline-block;
  max-width: 100%;
  margin: 0;
  padding: 0;

  color: var(--hell, #fff);
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.3;

  text-shadow:
    0 1px 2px rgba(0,0,0,0.65),
    0 0 6px rgba(0,0,0,0.40);

  white-space: normal;
}

/* "Neu" – Small Caps, rote Hervorhebung, Initial größer */
.blog-hero .td-banner-updated .td-badge .td-new {
  font-variant: small-caps;
  font-weight: 900;
  letter-spacing: 0.5px;
  color: #fb0308;
  text-transform: uppercase;   /* Fallback für Small Caps */
  margin-right: .6em;
  white-space: nowrap;
  display: inline-block;
}
.blog-hero .td-banner-updated .td-badge .td-new::first-letter {
  font-size: 1.35em !important;
  line-height: 1;
}

/* Datum */
.blog-hero .td-banner-updated .td-badge .td-date {
  display: inline;
  font-size: .9em;
  opacity: .9;
  white-space: normal;
  text-align: right;
}

/* Mobile Tweaks wie im Slider */
@media (max-width: 480px) {
  .blog-hero .td-banner-updated {
    left: .5rem;
    right: .5rem;
    bottom: .5rem;
    max-width: min(94%, calc(100% - 1.5rem));
  }
  .blog-hero .td-banner-updated .td-badge {
    font-size: .95rem;
  }
  .blog-hero .td-banner-updated .td-badge .td-new {
    margin-right: .5em;
  }
}