#spfs-app { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
#spfs-app > .c-layout-page { flex: 1 0 auto; }
#spfs-app > .c-layout-footer { flex-shrink: 0; }
.live-flow { max-width: 500px; margin: 0 auto 24px; color: #3f444a; text-align: center; }
.live-flow-number { font-size: 28px; margin: 8px 0; }
.live-flow-time { display: block; font-size: 12px; font-weight: normal; line-height: 1.5; white-space: normal; }
.live-flow svg { display: block; width: 100%; height: auto; margin-top: 15px; }
.live-flow details { font-size: 13px; text-align: left; }
.live-flow summary { cursor: pointer; }
.live-flow details ul { max-height: 200px; overflow: auto; }
.flow-stale { color: #926000; font-weight: bold; }
.table [data-flow-value] .live-flow-time { font-size: 10px; white-space: nowrap; }
.table td.flow { min-width: 125px; }
.gallery-item .thumb-img { width: 100%; height: 180px; object-fit: cover; }
.pattern-img .thumb-img { width: 100%; height: 180px; object-fit: contain; }
.dashboard-patterns { margin: 20px auto; padding-left: 20px; font-size: 1.3rem; }
.dashboard-patterns li { margin-bottom: 14px; }
#dashboard .container { width: auto; max-width: 1800px; }
#dashboard .column { min-width: 0; }
#dashboard .box { height: 100%; }
.photo-viewer { border: 0; background: #171b20; color: white; padding: 45px 16px 16px; max-width: 95vw; max-height: 95vh; text-align: center; }
.photo-viewer::backdrop { background: rgb(0 0 0 / 85%); }
.photo-viewer img { display: block; max-width: 85vw; max-height: 70vh; margin: auto; object-fit: contain; }
.photo-viewer button { color: #fff; background: #3c4652; border: 1px solid #657080; padding: 8px 15px; cursor: pointer; }
.photo-close { position: absolute; top: 4px; right: 5px; }
.carousel-pause { position: absolute; bottom: 8px; right: 12px; z-index: 12; background: rgb(0 0 0 / 65%); color: white; border: 0; padding: 5px 8px; font-size: 12px; }
.carousel-indicators [role=button] { cursor: pointer; }
@media (min-width: 992px) { .c-mega-menu li:focus-within > .dropdown-menu { display: block; } }
@media (max-width: 767px) {
  .gallery-item .thumb-img { height: 125px; }
  .flow-data-container { margin-bottom: 20px; }
  .c-layout-header .c-brand { max-width: 100%; }
}