/* Full-screen toggle for the Live Track Record chart (apps/public_track.py).

   The ⤢ button (.public-fs-btn) flips `.public-chart-fullscreen` on the chart
   card via a clientside callback. In that state the card is pinned over the whole
   viewport and the graph is stretched to fill it; the callback also fires a window
   `resize` so Plotly re-fits. The figure is built with autosize (no fixed height),
   so it grows/shrinks with its container in both states. Works inside an <iframe>
   (fills the frame's viewport) — no browser Fullscreen API needed. */

.public-chart-card {
    position: relative;  /* anchor the absolutely-positioned toggle button */
}

/* The toggle button, tucked into the top-right corner of the card. */
.public-fs-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 10;
    width: 32px;
    height: 32px;
    line-height: 1;
    font-size: 16px;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 4px;
    cursor: pointer;
}
.public-fs-btn:hover {
    background: rgba(255, 255, 255, 0.18);
}

/* Full-screen state: pin the card over the entire viewport. */
.public-chart-card.public-chart-fullscreen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    margin: 0 !important;
    border-radius: 0;
    z-index: 1050;
}

/* Stretch the body + graph to fill the pinned card (overrides the graph's inline
   height:400px — external !important beats a non-important inline style). */
.public-chart-fullscreen .card-body {
    height: 100%;
}
.public-chart-fullscreen .public-cum-graph {
    height: 100% !important;
}