/* Déclaration des fontes Achemine (dans public/fonts/) */ @font-face { font-family: 'Achemine'; src: url('/public/fonts/achemine_regular.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: 'Achemine'; src: url('/public/fonts/achemine_bold.ttf') format('truetype'); font-weight: 700; font-style: normal; font-display: swap; } @font-face { font-family: 'Achemine'; src: url('/public/fonts/achemine_italic.ttf') format('truetype'); font-weight: 400; font-style: italic; font-display: swap; } .afl-quais-departs__container { --bg-color: #042054; /* Deep dark blue background */ --header-bg: #083c84; /* Lighter vibrant blue header */ --accent-cyan: #00c3e3; /* Cyan timeline color */ --accent-yellow: #cce815; /* Bright chartreuse/lime-yellow for departure time */ --text-grey: #a0b2d6; /* Light grey-blue for train info */ } .afl-quais-departs__container { display: flex; flex-direction: column; width: 100vw; height: 100vh; background-color: var(--bg-color); color: white; font-family: 'Achemine', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; overflow: hidden; position: relative; } /* --- HEADER --- */ .afl-quais-departs__header { height: 12vh; background-color: var(--header-bg); display: flex; justify-content: space-between; align-items: center; padding: 0 3vw; border-bottom: 1px solid rgba(255, 255, 255, 0.1); z-index: 10; box-sizing: border-box; } .afl-quais-departs__header-left { display: flex; align-items: center; gap: 1.2vw; } .afl-quais-departs__header-title { font-size: 5vh; font-weight: 700; letter-spacing: -0.02em; } .afl-quais-departs__header-clock { font-size: 5vh; font-weight: 700; } /* --- MAIN CONTENT --- */ .afl-quais-departs__main { flex: 1; display: flex; position: relative; box-sizing: border-box; } /* --- LEFT PANE (GLUED TO LEFT/TOP, ROUNDED BOTTOM RIGHT) --- */ .afl-quais-departs__left-pane { position: absolute; top: 0; left: 0; width: 35vw; height: 38vh; background: rgba(255, 255, 255, 0.07); border-radius: 0 0 24px 0; /* Only bottom-right is rounded */ padding: 4vh 3vw; display: flex; flex-direction: column; box-sizing: border-box; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-right: 1px solid rgba(255, 255, 255, 0.08); border-bottom: 1px solid rgba(255, 255, 255, 0.08); } .afl-quais-departs__time-status { display: flex; align-items: center; gap: 1vw; margin-bottom: 1.5vh; } .afl-quais-departs__time { font-size: 7.5vh; font-weight: 800; color: var(--accent-yellow); line-height: 1; } .afl-quais-departs__status-pill { display: inline-flex; align-items: center; background-color: #005eb8; border-radius: 3vh; padding: 0.6vh 0.8vw; font-size: 2.2vh; font-weight: 600; color: white; width: max-content; } .afl-quais-departs__status-pill svg { margin-right: 0.5vw; } .afl-quais-departs__status-pill--delayed { background-color: #ff9e43; color: #111; } .afl-quais-departs__status-pill--suppressed { background-color: #ff4c5b; color: #111; } .afl-quais-departs__destination { font-size: 5.5vh; font-weight: 700; line-height: 1.15; color: #ffffff; margin-bottom: 1.5vh; word-wrap: break-word; } .afl-quais-departs__train-info { font-size: 3vh; color: var(--text-grey); display: flex; gap: 0.8vw; } .afl-quais-departs__train-type { font-weight: 800; } .afl-quais-departs__train-number { font-weight: 500; } /* --- RIGHT PANE (TIMELINE) --- */ .afl-quais-departs__right-pane { position: absolute; top: 4vh; left: 38vw; width: 58vw; bottom: 12vh; display: flex; flex-direction: column; justify-content: center; /* Center stops list vertically */ box-sizing: border-box; } .afl-quais-departs__stops-window { width: 100%; max-height: 100%; overflow: hidden; position: relative; } .afl-quais-departs__stops-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; width: 100%; } .afl-quais-departs__stop-item { display: flex; align-items: center; height: 6.2vh; position: relative; box-sizing: border-box; } /* Timeline Indicator (Line segment + Dot) */ .afl-quais-departs__stop-indicator { position: relative; width: 4vw; height: 100%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .afl-quais-departs__stop-line { position: absolute; left: 50%; top: 0; bottom: 0; width: 0.6vh; transform: translateX(-50%); background-color: var(--accent-cyan); box-shadow: 0 0 6px rgba(0, 195, 227, 0.4); z-index: 1; } /* Adjust line ends for first and last stops */ .afl-quais-departs__stop-item.is-first .afl-quais-departs__stop-line { top: 50%; } .afl-quais-departs__stop-item.is-last .afl-quais-departs__stop-line { bottom: 50%; } /* Standard dot */ .afl-quais-departs__stop-dot { width: 1.4vh; height: 1.4vh; border-radius: 50%; background-color: var(--accent-cyan); box-shadow: 0 0 6px rgba(0, 195, 227, 0.6); z-index: 2; position: relative; } /* Terminus dot */ .afl-quais-departs__stop-dot.is-terminus { width: 2.6vh; height: 2.6vh; background-color: var(--bg-color); /* Hollow effect */ border: 0.6vh solid var(--accent-cyan); box-shadow: 0 0 8px rgba(0, 195, 227, 0.8); border-radius: 50%; } /* Stop Names */ .afl-quais-departs__stop-name { font-size: 3.8vh; font-weight: 500; color: #ffffff; padding-left: 1vw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .afl-quais-departs__stop-name.is-terminus { font-size: 4.5vh; font-weight: 700; color: #ffffff; padding-left: 1vw; } /* --- BOTTOM TRAIN ILLUSTRATION --- */ .afl-quais-departs__bottom-container { position: absolute; bottom: 3.5vh; left: 38vw; width: 42vw; display: flex; justify-content: center; align-items: center; box-sizing: border-box; } .afl-quais-departs__train-illustration { display: flex; justify-content: center; opacity: 0.85; } /* --- VOIE BOX (PLATFORM BOX) --- */ .afl-quais-departs__platform-box { position: absolute; bottom: 2vh; right: 2vw; background-color: #ffffff; border-radius: 8px; width: 6.5vw; height: 13vh; display: flex; flex-direction: column; align-items: center; justify-content: center; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.35); z-index: 10; box-sizing: border-box; } .afl-quais-departs__platform-label { font-size: 2.2vh; color: var(--bg-color); font-weight: 700; text-transform: capitalize; line-height: 1; margin-bottom: 0.5vh; } .afl-quais-departs__platform-value { font-size: 7vh; color: var(--bg-color); font-weight: 800; line-height: 1; } /* --- NO DEPARTURE / LOADING STATE --- */ .afl-quais-departs__no-departure { display: flex; justify-content: center; align-items: center; height: 88vh; font-size: 6vh; font-weight: 600; color: #a4c4e0; }