/* =========================================================
   MaHe LIVE – Liveticker classic-full.css
   Design-Anpassung an MaHe Info Notices PRO (v6)
   ========================================================= */

/* === Design-Tokens (aus Info Notices übernommen) === */
:root {
  --mahe-bg:       #f0f0f0;
  --mahe-accent:   #c0392b;       /* roter Balken links */
  --mahe-text:     #1a1a1a;
  --mahe-muted:    #555;
  --mahe-border:   rgba(0,0,0,0.10);
  --mahe-font:     -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --mahe-radius:   8px;
  --mahe-danger:   #b91c1c;
  --mahe-urgent-bg:rgba(185,28,28,0.07);
  --mahe-pin-bg:   rgba(180,83,9,0.07);
  --mahe-pin-acc:  #b45309;
}

/* === Container === */
.mahe-ticker-box {
  background:    var(--mahe-bg) !important;
  border:        3px solid transparent !important;
  border-left:   4px solid var(--mahe-accent) !important;
  border-radius: var(--mahe-radius) !important;
  box-shadow:    0 2px 8px rgba(0,0,0,0.10), 0 1px 3px rgba(0,0,0,0.06) !important;
  padding:       0 !important;
  font-family:   var(--mahe-font) !important;
  font-size:     15px !important;
  position:      relative !important;
  overflow:      hidden !important;
  z-index:       50 !important;
}
.mahe-ticker-box * { box-sizing: border-box; }

/* === Header === */
.mahe-ticker-head {
  font-weight:     800 !important;
  font-size:       clamp(1.25rem, 5vw, 1.6rem) !important;
  padding:         13px 14px 11px !important;
  margin:          0 !important;
  display:         flex !important;
  align-items:     center !important;
  justify-content: center !important;
  text-align:      center !important;
  color:           var(--mahe-text) !important;
  border-bottom:   1px solid var(--mahe-border) !important;
  line-height:     1.3 !important;
}
.mahe-head-center {
  display:         inline-flex !important;
  align-items:     center !important;
  gap:             7px !important;
  flex-wrap:       wrap !important;
  justify-content: center !important;
}

@media (max-width: 360px) {
  .mahe-ticker-head { font-size: 1.15rem !important; padding: 10px 10px 9px !important; }
}

/* === Police-Bar (EIL-Blaulicht) === */
.mahe-policebar {
  display: none;
  height:  5px;
  width:   100%;
  background: linear-gradient(90deg, #0a58ca 0 50%, var(--mahe-danger) 50% 100%);
  background-size: 80px 5px;
}
.mahe-policebar.is-active {
  display:   block !important;
  animation: mahe-police-flash .22s linear infinite;
}
@keyframes mahe-police-flash {
  0%   { background-position: 0 0; }
  100% { background-position: 80px 0; }
}

/* === Scrollbereich === */
.mahe-ticker-scroll {
  max-height:                 20vh;
  max-height:                 20dvh;
  overflow-y:                 auto;
  overflow-x:                 hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior:        contain;
  overflow-anchor:            none;
}
@media (max-width: 768px) {
  .mahe-ticker-scroll {
    max-height: 35vh;
    max-height: 35dvh;
    touch-action: pan-y;
  }
}
.mahe-ticker-scroll::-webkit-scrollbar { width: 6px; }
.mahe-ticker-scroll::-webkit-scrollbar-thumb {
  background:    rgba(0,0,0,0.12);
  border-radius: 6px;
}

/* === Liste === */
.mahe-ticker-list { list-style: none; margin: 0; padding: 0; }

/* === Eintrag === */
.mahe-item {
  padding:      10px 14px !important;
  border-bottom:1px solid var(--mahe-border) !important;
  font-size:    0.93em !important;
  display:      flex !important;
  gap:          11px !important;
  align-items:  flex-start !important;
  overflow-wrap:anywhere !important;
  transition:   background .12s !important;
}
.mahe-item:last-child { border-bottom: none !important; }
.mahe-item[data-url]  { cursor: pointer !important; }
.mahe-item[data-url]:hover {
  background: rgba(0,0,0,0.03) !important;
}

/* Pinned – gelber Balken (wie Info Notice Akzent-Variante) */
.mahe-item.pinned {
  border-left: 3px solid var(--mahe-pin-acc) !important;
  background:  var(--mahe-pin-bg) !important;
  padding-left:11px !important;
}

/* Urgent / EIL – roter Balken */
.mahe-item.urgent {
  border-left: 3px solid var(--mahe-danger) !important;
  background:  var(--mahe-urgent-bg) !important;
  padding-left:11px !important;
}

/* === Links / Zeit-Spalte === */
.mahe-left {
  min-width:      58px !important;
  display:        flex !important;
  flex-direction: column !important;
  gap:            5px !important;
  flex-shrink:    0 !important;
}

.mahe-time {
  font-weight: 700 !important;
  font-size:   0.82em !important;
  color:       var(--mahe-muted) !important;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums !important;
}

/* === Status-Badges (gleiche Pill-Optik wie Info Notices Label) === */
.mahe-new,
.mahe-urgent-badge {
  display:       inline-block !important;
  background:    var(--mahe-danger) !important;
  color:         #fff !important;
  font-size:     0.68em !important;
  font-weight:   800 !important;
  letter-spacing:.04em !important;
  padding:       2px 7px !important;
  border-radius: 999px !important;
  line-height:   1.5 !important;
  white-space:   nowrap !important;
}

.mahe-pin { font-size: 13px !important; opacity: .85 !important; }

/* === Textbereich === */
.mahe-right  { flex: 1; min-width: 0; }

.mahe-entry-title {
  margin-bottom: 3px !important;
  line-height:   1.3 !important;
  font-size:     1em !important;
  color:         var(--mahe-text) !important;
}
.mahe-entry-title strong { font-weight: 700 !important; }

.mahe-text {
  line-height: 1.5 !important;
  color:       var(--mahe-text) !important;
  font-size:   0.95em !important;
}
.mahe-text p             { margin: 0 0 5px; }
.mahe-text p:last-child  { margin-bottom: 0; }
.mahe-text a {
  color:           var(--mahe-accent) !important;
  text-decoration: underline !important;
  word-break:      break-word !important;
}

/* === Ablauf-Info (wie mahe-meta) === */
.mahe-expire {
  display:      flex !important;
  align-items:  center !important;
  gap:          4px !important;
  margin-top:   6px !important;
  padding-top:  5px !important;
  border-top:   1px dashed rgba(0,0,0,0.14) !important;
  font-size:    0.75em !important;
  color:        var(--mahe-muted) !important;
}
.mahe-expire::before {
  font-family: dashicons !important;
  content:     "\f469" !important;   /* Uhr-Icon */
  font-size:   12px !important;
  color:       var(--mahe-muted) !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
}

/* === OG-Linkvorschau === */
.mahe-preview {
  margin-top:     8px !important;
  display:        flex !important;
  gap:            10px !important;
  border:         1px solid var(--mahe-border) !important;
  border-radius:  6px !important;
  overflow:       hidden !important;
  background:     rgba(0,0,0,0.03) !important;
  text-decoration:none !important;
  color:          inherit !important;
}
.mahe-preview-img {
  width:               78px !important;
  height:              60px !important;
  background-size:     cover !important;
  background-position: center !important;
  flex-shrink:         0 !important;
}
.mahe-preview-meta  { padding: 7px 10px 7px 0 !important; }
.mahe-preview-title {
  font-size:             0.8em !important;
  font-weight:           700 !important;
  line-height:           1.25 !important;
  display:               -webkit-box !important;
  -webkit-line-clamp:    2 !important;
  -webkit-box-orient:    vertical !important;
  overflow:              hidden !important;
  color:                 var(--mahe-text) !important;
}
.mahe-preview-host {
  font-size:     0.72em !important;
  color:         var(--mahe-muted) !important;
  white-space:   nowrap !important;
  overflow:      hidden !important;
  text-overflow: ellipsis !important;
  margin-top:    3px !important;
}

/* === Footer === */
.mahe-footer {
  padding:    8px 14px !important;
  font-size:  0.7em !important;
  color:      var(--mahe-muted) !important;
  text-align: center !important;
  border-top: 1px solid var(--mahe-border) !important;
  opacity:    .7 !important;
}

/* === Pulsieren (EIL-Einträge) === */
@keyframes mahe-pulse-item {
  0%,100% { background: var(--mahe-urgent-bg); }
  50%     { background: rgba(185,28,28,0.14); }
}
.mahe-item.urgent.mahe-anim-pulse {
  animation: mahe-pulse-item 1.4s ease-in-out infinite !important;
}

/* === Mobile === */
@media (max-width: 600px) {
  .mahe-ticker-box  { font-size: 14px !important; }
  .mahe-left        { min-width: 50px !important; }
  .mahe-preview-img { width: 64px !important; height: 52px !important; }
}