/* Product Notice Ticker - CSS */
.tws-notice-wrap {
  --tws-bg: #F0F9FF;
  --tws-fg: #0F172A;
  --tws-border: #93C5FD;
  background: var(--tws-bg);
  color: var(--tws-fg);
  border: 1px solid var(--tws-border);
  border-radius: 8px;
  padding: 10px 12px;
  overflow: hidden;
  box-shadow: 0 1px 1px rgba(0,0,0,.04);
  font-size: 15px;
  line-height: 1.4;
}
.tws-notice-inner {
  display: flex;
  align-items: center;
  gap: 12px;
}
/* Badge on the left with icon + "Notice" text */
.tws-badge {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(147,197,253,0.35); /* based on border */
  color: var(--tws-fg);
  border: 1px solid var(--tws-border);
  border-radius: 6px;
  padding: 3px 8px;
  font-weight: 600;
  font-size: 13px;
  line-height: 1;
}
.tws-badge-icon { font-size: 16px; line-height: 1; }
.tws-ticker {
  overflow: hidden;
  position: relative;
  flex: 1 1 auto;
}
.tws-track {
  display: inline-block;
  white-space: nowrap;
  will-change: transform;
}
.tws-text {
  padding-right: 40px; /* spacer for seamless loop */
}
.tws-notice-wrap[data-paused="true"] .tws-track {
  animation-play-state: paused !important;
}
@media (prefers-reduced-motion: reduce) {
  .tws-track { animation: none !important; transform: none !important; }
}