/* Solvinden Live — mobile-first compact styles, visually aligned with 401 */

.nlsvk-solvinden-live {
    width: 100%;
    box-sizing: border-box;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
    color: #dfe6f5;
}

:root {
    --nlsvk-space-xxs: 0.25rem;
    --nlsvk-space-xs: 0.35rem;
    --nlsvk-space-sm: 0.75rem;
    --nlsvk-space-md: 1rem;
    --nlsvk-card-padding-vertical: 0.42rem;
    --nlsvk-card-padding-horizontal: 0.48rem;
    --nlsvk-card-height: 2.6rem;
}

.nlsvk-solvinden-head {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:0.5rem;
    margin-bottom:0.45rem;
}
.nlsvk-solvinden-title { font-weight:600; color:#ffffff; font-size:0.95rem; }
.nlsvk-solvinden-meta { font-size:0.75rem; color:#9fb0c6; }

.nlsvk-solvinden-cards {
    display:flex;
    gap:0.4rem;
    overflow-x:auto;
    padding-bottom:0.2rem;
}
.nlsvk-solvinden-card {
    min-width:92px;
    background: rgba(8,14,25,0.9);
    border:1px solid rgba(159,176,198,0.12);
    border-radius:10px;
    padding: var(--nlsvk-card-padding-vertical) var(--nlsvk-card-padding-horizontal);
    display:flex;
    flex-direction:column;
    gap:0.25rem;
    align-items:flex-start;
    flex:0 0 auto;
}
.nlsvk-solvinden-card-label { font-size:0.72rem; color:#9fb0c6; }
.nlsvk-solvinden-card-value { font-size:1.1rem; font-weight:700; color:#fff; }
.nlsvk-solvinden-sparkline { width:100%; }
.nlsvk-solvinden-sparkline svg { display:block; }

.nlsvk-solvinden-graph { margin-top:0.5rem; }
.nlsvk-solvinden-expand { background:transparent; border:1px solid rgba(159,176,198,0.12); color:#9fb0c6; padding:0.25rem 0.5rem; border-radius:6px; }
.nlsvk-solvinden-graph-placeholder { color:#9fb0c6; font-size:0.85rem; margin-top:0.35rem; }

/* larger screens: grid layout for cards */
@media (min-width: 640px) {
    .nlsvk-solvinden-cards { display:grid; grid-template-columns: repeat(4, 1fr); gap:0.6rem; overflow:visible; }
    .nlsvk-solvinden-card { min-width:0; }
}