/* TR — shared clock + weather banner styles (dark glass, matches PM pages) */
.tr-clock-banner {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  margin: 0 0 22px; padding: 14px 22px; border-radius: 18px;
  background: rgba(10,11,13,0.72);
  backdrop-filter: blur(24px) saturate(160%); -webkit-backdrop-filter: blur(24px) saturate(160%);
  border: 1px solid rgba(255,255,255,0.10);
  color: #e2e8f0; box-shadow: 0 10px 24px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.06);
  flex-wrap: wrap;
}
.tr-cb-left { display: grid; gap: 4px; min-width: 170px; }
.tr-cb-label { font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #6f97a8; }
.tr-cb-weather { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.tr-cb-weather strong { font-size: 22px; line-height: 1; font-weight: 800; color: #22d3ee; }
.tr-cb-weather span { color: #94a3b8; font-size: 13px; font-weight: 600; }
.tr-cb-main { display: flex; align-items: baseline; justify-content: flex-end; gap: 12px; flex-wrap: wrap; }
.tr-cb-date { color: #94a3b8; font-size: 13px; font-weight: 600; }
.tr-cb-time {
  color: #eef3f8; font-variant-numeric: tabular-nums;
  font-size: clamp(26px, 2.6vw, 38px); line-height: 1; font-weight: 800; letter-spacing: -.02em;
}
.tr-cb-zone { color: #6f97a8; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }

/* ============================================================
   Construction (REIF Build) rail icon — global polish.
   Loaded on every office page via this shared stylesheet so the
   gold hammer icon + "Construction" label fit cleanly and the
   hover/active lighting MATCHES the PM (indigo) icon exactly,
   just in the gold hue. Keeps the rail uniform across all pages.
   ============================================================ */
.app-rail a.constr { color:#f59e0b !important; font-size:7.5px !important; letter-spacing:0 !important; line-height:1.05 !important; }
.app-rail a.constr span, .app-rail a.constr { word-break:normal; }
/* keep the long "Construction" label inside the 52px pill so it never sticks out */
.app-rail a.constr { overflow:hidden; }
.app-rail a.constr svg { stroke:#f59e0b !important; }
/* Hover: same opacity as the standard rail hover (0.12), gold tint + white text — uniform feel */
.app-rail a.constr:hover { background: rgba(245,158,11,0.12) !important; color:#fde68a !important; }
.app-rail a.constr:hover svg { stroke:#fde68a !important; }
/* Active: mirror the PM active treatment (bg 0.30 + inset ring 0.45) in gold */
.app-rail a.constr.active { background: rgba(245,158,11,0.30) !important; color:#fbbf24 !important; box-shadow: inset 0 0 0 1px rgba(245,158,11,0.45) !important; }
.app-rail a.constr.active svg { stroke:#fbbf24 !important; }