/* Scroll Message Styles*/
:root {
  --scroll-speed: 100s; /* ?? Adjust this value for scroll speed */
}

.notice-container {
  display: flex;
  align-items: center;
  overflow: hidden;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  margin: 1px 0;
  font-family: Arial, Helvetica, sans-serif;
}

/* Left band */
.notice-label {
  background: #c70000;
  color: #fff;
  font-weight: bold;
  font-size: 12px;
  padding: 2px 2px;
  display: flex;
  align-items: center;
  gap: 6px;
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
  white-space: nowrap;
}
.notice-label .icon {
  font-size: 14px;
}

/* Scrolling section */
.notice-scroll {
  overflow: hidden;
  flex: 1;
  position: relative;
  padding: 2px 2px;
}
.notice-text {
  display: inline-block;
  white-space: nowrap;
  padding-left: 100%;
  animation: scroll-text var(--scroll-speed) linear infinite;
  color: #222;
  font-size: 13px;
  line-height: 1.6;
}
.notice-scroll:hover .notice-text {
  animation-play-state: paused;
}

@keyframes scroll-text {
  0% { transform: translateX(0%); }
  100% { transform: translateX(-100%); }
}

/* Text styling */
.notice-text a {
  color: #222;
  text-decoration: none;
  font-weight: 500;
}
.notice-text a strong {
  color: #c70000;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.5px;
}