@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=VT323&display=swap');
/* Departures board, scoped to .rail-board so it can sit inside the shared speedy page */
.rail-board{--led-amber:#ffb400;--led-green:#00ff66;--led-white:#fff;--board-bg:#07090c;--border-dashed:#3a3212;--font-digital:'VT323','Courier New',monospace;font-family:var(--font-digital);color:var(--led-amber);margin-top:-70px;position:relative;z-index:2}
.rail-board *{box-sizing:border-box}
/* ==========================================
       TOP DISPLAY: Main LED Board (Fills Screen)
       ========================================== */
    .display-container-top {
      width: 100%;
      min-height: 420px;
      background-color: var(--board-bg);
      border: clamp(6px, 1vw, 12px) solid #14171f;
      border-radius: 16px;
      box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.95), 0 12px 35px rgba(0, 0, 0, 0.8);
      padding: clamp(1rem, 2vh, 2rem) clamp(1rem, 2vw, 2.5rem);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      box-sizing: border-box;
    }

    /* Top Header Bar */
    .board-top-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      border-bottom: 2px solid rgba(255, 180, 0, 0.15);
      padding-bottom: 0.75rem;
    }

    .header-left {
      display: flex;
      align-items: center;
      gap: 1.5rem;
    }

    .platform-badge {
      background-color: var(--led-amber);
      color: #000;
      font-weight: bold;
      font-size: clamp(1.2rem, 2.5vh, 2rem);
      padding: 0.2em 0.6em;
      border-radius: 4px;
      letter-spacing: 2px;
      text-transform: uppercase;
      line-height: 1;
    }

    .station-header-title {
      color: var(--led-amber);
      font-size: clamp(1.8rem, 3.8vh, 3.2rem);
      letter-spacing: 2px;
      text-transform: uppercase;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    #clock {
      color: var(--led-amber);
      font-size: clamp(2rem, 4vh, 3.5rem);
      letter-spacing: 2px;
    }

    /* Featured 1st Departure Box */
    .featured-service-box {
      border: 2px dashed var(--border-dashed);
      border-radius: 10px;
      padding: clamp(0.8rem, 2vh, 1.5rem) clamp(1rem, 2vw, 1.8rem);
      background-color: rgba(11, 14, 20, 0.5);
      display: flex;
      flex-direction: column;
      gap: 1rem;
    }

    .primary-service-row {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      gap: 1rem;
    }

    #timewithdestination {
      font-size: clamp(2rem, 4.5vh, 4rem);
      color: var(--led-amber);
      letter-spacing: 1px;
      line-height: 1.1;
    }

    #estimatedtime {
      font-size: clamp(1.8rem, 4vh, 3.5rem);
      color: var(--led-green);
      letter-spacing: 1px;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .marquee-wrapper {
  background-color: #030406;
  border: 1px solid #131720;
  border-radius: 6px;
  height: clamp(48px, 6.5vh, 70px);
  line-height: clamp(48px, 6.5vh, 70px);
  overflow: hidden;
  position: relative;
  padding: 0; /* Clear padding so text starts flush against the right boundary */
}

.marquee {
  display: inline-block;
  white-space: nowrap;
  padding-left: 100%; /* Positions text completely off-screen to the right */
  animation: marquee-scroll 45s linear infinite;
  animation-delay: 1.5s; /* Small delay before it starts scrolling across */
}

.marquee span {
  font-size: clamp(1.6rem, 3.2vh, 2.8rem);
  color: var(--led-amber);
  white-space: nowrap;
}

@keyframes marquee-scroll {
  0% {
    transform: translate(0, 0); /* Starts scrolling from the right padding boundary */
  }
  100% {
    transform: translate(-100%, 0); /* Scrolls all the way past the left edge */
  }
}

    /* Subsequent Trains (2nd and 3rd Stacked Rows) */
    .subsequent-services {
      display: flex;
      flex-direction: column;
      gap: clamp(0.5rem, 1.5vh, 1.2rem);
      padding: 0.5rem 0.4rem;
    }

    .secondary-service-row {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      gap: 1rem;
    }

    .secondary-train-title {
      font-size: clamp(1.6rem, 3.5vh, 3rem);
      color: var(--led-amber);
    }

    .secondary-train-status {
      font-size: clamp(1.6rem, 3.5vh, 3rem);
      color: var(--led-green);
      white-space: nowrap;
    }

    /* Bottom Notice Message Area */
    .board-bottom-notice {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding-top: 0.75rem;
      border-top: 2px solid rgba(255, 180, 0, 0.15);
      gap: 1rem;
    }

    .notice-message {
  color: #a37800;
  font-size: clamp(1.2rem, 2.4vh, 2rem);
  white-space: normal;       /* Allows text to wrap across multiple lines */
  word-break: break-word;    /* Breaks long words safely if needed */
  overflow: visible;         /* Ensures all lines are displayed */
  line-height: 1.25;         /* Sets clean spacing between wrapped lines */
  flex: 1;                   /* Takes available width next to LIVE status */
}

    .live-status {
      color: var(--led-green);
      font-size: clamp(1.3rem, 2.8vh, 2.2rem);
      display: flex;
      align-items: center;
      gap: 0.5rem;
      letter-spacing: 1px;
      white-space: nowrap;
    }

    .live-dot {
      height: clamp(8px, 1.2vh, 14px);
      width: clamp(8px, 1.2vh, 14px);
      background-color: var(--led-green);
      border-radius: 50%;
      display: inline-block;
      box-shadow: 0 0 8px var(--led-green);
    }

    
.nre-logo{height:26px;width:auto;opacity:.95;vertical-align:middle;margin-right:10px}
.nre-row{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;margin-top:18px}

/* jQuery UI autocomplete menu, tidied to match */
.ui-autocomplete{z-index:50;max-height:260px;overflow-y:auto;font:600 1rem Figtree,system-ui,sans-serif;border:3px solid #17123f;border-radius:14px}