/* skutene.no — diskret "nå"-linje under hero */
.livebar { background: #0a1b25; border-bottom: 1px solid rgba(250,247,242,.07); color: rgba(250,247,242,.78); font-size: .86rem; position: relative; z-index: 2; }
.livebar__row { display: flex; align-items: center; gap: .15rem; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; padding: .35rem 0; }
.livebar__row::-webkit-scrollbar { display: none; }
.livebar__place { flex: none; font-size: .68rem; letter-spacing: .18em; text-transform: uppercase; color: rgba(250,247,242,.45); margin-right: .5rem; white-space: nowrap; }
.livebar__chip { flex: none; display: inline-flex; align-items: center; gap: .4rem; appearance: none; border: 1px solid transparent; background: transparent; color: inherit; font: inherit; padding: .3rem .65rem; border-radius: 999px; cursor: pointer; white-space: nowrap; transition: background .15s, border-color .15s, color .15s; }
.livebar__chip:hover { background: rgba(250,247,242,.05); color: #faf7f2; }
.livebar__chip[aria-expanded="true"] { background: rgba(232,160,76,.12); border-color: rgba(232,160,76,.35); color: #faf7f2; }
.livebar__chip:focus-visible { outline: 2px solid #e8a04c; outline-offset: 1px; }
.livebar__chip b { color: #faf7f2; font-weight: 600; }
.livebar__chip .wxi { width: 20px; height: 20px; }
.livebar__chip .lb-ico { width: 16px; height: 16px; color: #e8a04c; }
.livebar__val { display: inline-flex; align-items: center; gap: .35rem; font-variant-numeric: tabular-nums; }
.livebar__sep { flex: none; width: 1px; height: 1rem; background: rgba(250,247,242,.12); }
.livebar__clock { flex: none; margin-left: auto; padding-left: .75rem; font-variant-numeric: tabular-nums; color: rgba(250,247,242,.55); }
@media (max-width: 640px) { .lb-hide-s { display: none; } .livebar__place { display: none; } .livebar__sep { display: none; } }

.livebar__panel { border-top: 1px solid rgba(250,247,242,.07); padding: 1.1rem 0 1rem; animation: lb-in .18s ease-out; }
.livebar__panel[hidden] { display: none; }
@keyframes lb-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .livebar__panel { animation: none; } }

.lb-cols { display: grid; gap: 1rem 2rem; grid-template-columns: 1fr; align-items: start; }
@media (min-width: 760px) { .lb-cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); } }
.livebar h4 { margin: 0 0 .4rem; font-size: .66rem; letter-spacing: .18em; text-transform: uppercase; color: rgba(250,247,242,.45); font-weight: 600; }
.livebar h4 + ol { margin-bottom: .9rem; }
.lb-muted { color: rgba(250,247,242,.55); }
.lb-err { color: rgba(250,247,242,.55); margin: 0; }
.lb-big { font-size: 2.2rem; line-height: 1; font-weight: 600; color: #faf7f2; font-variant-numeric: tabular-nums; }
.lb-src { margin: .8rem 0 0; font-size: .72rem; color: rgba(250,247,242,.42); }
.lb-src a { color: rgba(250,247,242,.55); text-decoration: underline; text-underline-offset: 2px; }
.lb-src a:hover { color: #e8a04c; }
.cold { color: #8fc8f2 !important; }

.lb-now { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .2rem .8rem; }
.lb-now > .wxi { width: 56px; height: 56px; }
.lb-dl { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)); gap: .55rem 1rem; margin: .8rem 0 0; }
.lb-dl dt { font-size: .64rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(250,247,242,.42); }
.lb-dl dd { margin: .1rem 0 0; color: #faf7f2; font-variant-numeric: tabular-nums; }
.lb-dl .arrow { display: inline-block; color: #e8a04c; font-weight: 700; }

.lb-hours, .lb-days, .lb-list, .lb-deps { list-style: none; margin: 0; padding: 0; }
.lb-hours { display: grid; grid-template-columns: repeat(8, minmax(2.4rem, 1fr)); gap: .2rem; overflow-x: auto; scrollbar-width: thin; }
.lb-hours li { display: flex; flex-direction: column; align-items: center; padding: .25rem 0; border-radius: 6px; background: rgba(250,247,242,.03); font-variant-numeric: tabular-nums; }
.lb-hours .wxi { width: 24px; height: 24px; }
.lb-hours .h { font-size: .7rem; color: rgba(250,247,242,.45); }
.lb-hours .t { font-weight: 600; color: #faf7f2; }
.lb-hours .p { font-size: .64rem; color: #6fb3e6; min-height: 1em; }
.lb-days li { display: grid; grid-template-columns: 2.8rem 24px 1fr auto; align-items: center; gap: .5rem; padding: .2rem 0; font-variant-numeric: tabular-nums; }
.lb-days .wxi { width: 24px; height: 24px; }
.lb-days .d { text-transform: capitalize; }
.lb-days .mm { color: rgba(250,247,242,.5); }
.lb-days .mm b { color: #faf7f2; }
.lb-days .p { font-size: .75rem; color: #6fb3e6; }

.lb-arc, .lb-tide { width: 100%; max-width: 26rem; height: auto; display: block; overflow: visible; }
.lb-arc .hz { stroke: rgba(250,247,242,.2); }
.lb-arc .path { fill: none; stroke: rgba(250,247,242,.18); stroke-width: 2; stroke-dasharray: 4 5; }
.lb-arc .done { fill: none; stroke: #e8a04c; stroke-width: 2.5; stroke-linecap: round; }
.lb-arc .sun { fill: #f2b64f; }
.lb-arc .glow { fill: rgba(242,182,79,.18); }
.livebar .lbl { fill: rgba(250,247,242,.5); font-size: 10px; font-variant-numeric: tabular-nums; }
.lb-tide .curve { fill: none; stroke: #6fb3e6; stroke-width: 2.2; stroke-linecap: round; }
.lb-tide .pt { fill: #6fb3e6; }
.lb-tide .now { stroke: rgba(232,160,76,.6); stroke-dasharray: 3 3; }
.lb-tide .cur { fill: #e8a04c; stroke: #0a1b25; stroke-width: 2; }
.lb-list li { display: grid; grid-template-columns: 4rem 1fr auto; gap: .5rem; padding: .2rem 0; font-variant-numeric: tabular-nums; color: #faf7f2; }
.lb-list li span:nth-child(2) { text-transform: capitalize; }

.lb-tabs { display: inline-flex; flex-wrap: wrap; gap: .25rem; padding: .18rem; border-radius: 999px; background: rgba(250,247,242,.05); margin-bottom: .7rem; }
.lb-tabs button { appearance: none; border: 0; background: transparent; color: rgba(250,247,242,.7); font: inherit; font-size: .8rem; padding: .28rem .8rem; border-radius: 999px; cursor: pointer; }
.lb-tabs button[aria-selected="true"] { background: #e8a04c; color: #08151c; font-weight: 600; }
.lb-deps { columns: 1; }
@media (min-width: 760px) { .lb-deps { columns: 2; column-gap: 2rem; } }
.lb-deps li { break-inside: avoid; display: grid; grid-template-columns: 2.8rem 1fr auto; align-items: center; gap: .6rem; padding: .32rem 0; border-top: 1px solid rgba(250,247,242,.05); }
.lb-deps .line { display: inline-grid; place-items: center; min-width: 2.4rem; height: 1.5rem; border-radius: 5px; font-weight: 700; font-size: .8rem; color: #faf7f2; background: #2c5670; font-variant-numeric: tabular-nums; }
.lb-deps .line.water { background: #1f6f8b; }
.lb-deps .line.bus { background: #3b6e3a; }
.lb-deps .dest { color: #faf7f2; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lb-deps .dest small { color: rgba(250,247,242,.42); font-size: .7rem; }
.lb-deps .when { font-weight: 600; color: #faf7f2; font-variant-numeric: tabular-nums; white-space: nowrap; }
.lb-deps .when s { font-weight: 400; font-size: .7rem; color: rgba(250,247,242,.4); }
.lb-deps .cx .dest, .lb-deps .cx .line { opacity: .45; text-decoration: line-through; }
.lb-deps .cx .when { color: #e07a6b; }
.livebar i.rt, .livebar i.pl { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-left: .35rem; vertical-align: middle; }
.livebar i.rt { background: #5fd38a; box-shadow: 0 0 0 3px rgba(95,211,138,.16); }
.livebar i.pl { background: rgba(250,247,242,.2); }

/* Arrangementer */
.lb-events { list-style: none; margin: 0; padding: 0; columns: 1; }
@media (min-width: 760px) { .lb-events { columns: 2; column-gap: 2rem; } }
.lb-events li { break-inside: avoid; display: grid; grid-template-columns: 6.5rem 1fr auto; gap: .6rem; align-items: baseline; padding: .32rem 0; border-top: 1px solid rgba(250,247,242,.05); }
.lb-events .ev-when { color: rgba(250,247,242,.55); font-variant-numeric: tabular-nums; white-space: nowrap; }
.lb-events .ev-when::first-letter { text-transform: uppercase; }
.lb-events .ev-when.today { color: #e8a04c; font-weight: 600; }
.lb-events .ev-title { color: #faf7f2; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lb-events .ev-title a { color: inherit; text-decoration: none; border-bottom: 1px solid rgba(232,160,76,.35); }
.lb-events .ev-title a:hover { color: #e8a04c; border-color: #e8a04c; }
.lb-events .ev-venue { font-size: .72rem; color: rgba(250,247,242,.45); white-space: nowrap; }
.lb-more { margin: .7rem 0 0; font-size: .8rem; color: rgba(250,247,242,.55); }
.lb-more a { color: rgba(250,247,242,.75); text-decoration: underline; text-underline-offset: 2px; }
.lb-more a:hover { color: #e8a04c; }

/* Nyheter */
.lb-news { list-style: none; margin: 0; padding: 0; }
.lb-news li { display: grid; grid-template-columns: 6rem 1fr auto; gap: .6rem; align-items: baseline; padding: .34rem 0; border-top: 1px solid rgba(250,247,242,.05); }
.lb-news li:first-child { border-top: 0; }
.lb-news .nw-date { color: rgba(250,247,242,.5); font-variant-numeric: tabular-nums; white-space: nowrap; }
.lb-news .nw-title { color: #faf7f2; text-decoration: none; line-height: 1.3; }
.lb-news .nw-title:hover { color: #e8a04c; text-decoration: underline; text-underline-offset: 2px; }
.lb-news .nw-src { font-size: .72rem; color: rgba(250,247,242,.45); white-space: nowrap; }
@media (max-width: 640px) { .lb-news li { grid-template-columns: 5.8rem 1fr; } .lb-news .nw-src { grid-column: 2; } }

/* Vis at linja kan rulles sidelengs på smale skjermer */
@media (max-width: 900px) {
  .livebar__row { -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); padding-right: 2rem; }
  .livebar__row.at-end { -webkit-mask-image: none; mask-image: none; }
}