/* DARK MODE (body.punchy) — port av prod sin dark-tema. * * To distinkte sub-paletter: * - today/rom/booking-faner: LH-grønn på #1a1a1a/#252525 * - program/nerd-faner: GitHub-palett (#0d1117/#21262d/#58a6ff/#3fb950) * * Aktiveres ved at har klassen "punchy" (toggles av app.js). */ body.punchy { background: #111; color: #ddd; --bg-primary: #111; --bg-secondary: #1a1a1a; --bg-tertiary: #222; --bg-card: #1a1a1a; --border: #2a2a2a; --border-light: #252525; --text-primary: #ddd; --text-secondary: #bbb; --text-muted: #777; --green-dim: rgba(74, 178, 0, 0.10); --orange-dim: rgba(240, 136, 62, 0.10); --red-dim: rgba(248, 81, 73, 0.10); --cyan-dim: rgba(88, 166, 255, 0.10); --purple-dim: rgba(188, 140, 255, 0.10); --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4); --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.5), 0 4px 16px rgba(0, 0, 0, 0.3); --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.6); --shadow-nav: 0 1px 3px rgba(0, 0, 0, 0.5); } /* NAV */ body.punchy .nav { background: #1a1a1a; border-color: #2a2a2a; backdrop-filter: none; } body.punchy .nav-brand img { filter: brightness(0) invert(1); } body.punchy .nav-link { color: #888; } body.punchy .nav-link:hover { color: #ccc; background: #222; } body.punchy .nav-link.active { color: #4ab200; background: rgba(74, 178, 0, 0.10); } body.punchy .nav-clock, body.punchy .nav-date { color: #666; } body.punchy .nav-date strong { color: #4ab200; } body.punchy .theme-toggle { background: #222; border-color: #333; color: #888; } body.punchy .theme-toggle:hover { background: #4ab200; color: #111; border-color: #4ab200; } /* SECTION-HEADER */ body.punchy .section-title { color: #888; } body.punchy .section-line { background: #2a2a2a; opacity: 1; } body.punchy .section-badge { background: #222; color: #888; } body.punchy .refresh-btn { background: #1a1a1a; border-color: #333; color: #888; } body.punchy .refresh-btn:hover { background: #4ab200; color: #111; border-color: #4ab200; } body.punchy .refresh-ts { color: #555; } body.punchy .help-btn { background: #222; border-color: #333; color: #888; } body.punchy .help-btn:hover { background: #4ab200; color: #111; } /* I DAG — events */ body.punchy #idag .ev { background: #1a1a1a; border-color: #252525; } body.punchy #idag .ev:hover { border-color: #333; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.4); } body.punchy #idag .ev-room { color: #999; } body.punchy #idag .ev-name { color: #eee; } body.punchy #idag .ev-meta { color: #666; } body.punchy #idag .ev-tek { color: #4ab200; } body.punchy #idag .ev-tek.none { color: #444; } body.punchy #idag .ev-time { color: #666; } body.punchy #idag .ev.status-active { border-left-color: #00bcd4; background: rgba(0, 188, 212, 0.04); border-color: rgba(0, 188, 212, 0.20); } body.punchy #idag .ev.status-active .ev-name { color: #00e5ff; } body.punchy #idag .ev.status-rigg { border-left-color: #4ab200; background: rgba(74, 178, 0, 0.04); border-color: rgba(74, 178, 0, 0.20); } body.punchy #idag .ev.status-getin { border-left-color: #ffa000; background: rgba(255, 160, 0, 0.04); border-color: rgba(255, 160, 0, 0.20); } body.punchy #idag .ev.status-getout { border-left-color: #ff6600; background: rgba(255, 102, 0, 0.04); border-color: rgba(255, 102, 0, 0.20); } body.punchy #idag .ev.status-pending { border-left-color: #333; } body.punchy #idag .ev.status-finished { border-left-color: #222; opacity: 0.3; } body.punchy #idag .ev-status.s-active { background: rgba(0, 188, 212, 0.20); color: #00e5ff; } body.punchy #idag .ev-status.s-rigg { background: rgba(74, 178, 0, 0.20); color: #4ab200; } body.punchy #idag .ev-status.s-getin { background: rgba(255, 160, 0, 0.20); color: #ffa000; } body.punchy #idag .ev-status.s-getout { background: rgba(255, 102, 0, 0.20); color: #ff6600; } body.punchy #idag .ev-status.s-pending { background: #222; color: #555; } /* I DAG — sidebar */ body.punchy #idag .sidebar-card { background: #1a1a1a; border-color: #252525; } body.punchy #idag .sidebar-card:hover { border-color: #333; } body.punchy #idag .sidebar-label { color: #555; } body.punchy #idag .room-text.free { color: #4ab200; } body.punchy #idag .room-text.busy { color: #ff5252; } body.punchy #idag .room-dot.free { background: #4ab200; box-shadow: 0 0 10px #4ab200; } body.punchy #idag .room-dot.busy { background: #ff5252; box-shadow: 0 0 10px #ff5252; } body.punchy #idag .room-next { color: #666; } body.punchy #idag .vert-name { color: #bbb; } body.punchy #idag .vert-name.on { color: #4ab200; } body.punchy #idag .vert-tid { color: #555; } body.punchy #idag .live-dot { background: #4ab200; box-shadow: 0 0 8px #4ab200; } body.punchy #idag .sidebar-btn { background: #222; border-color: #333; color: #888; } body.punchy #idag .sidebar-btn:hover { background: #4ab200; border-color: #4ab200; color: #111; } body.punchy #idag .saler-row.free .saler-dot { background: #4ab200; } body.punchy #idag .saler-row.busy .saler-dot { background: #ff5252; } body.punchy #idag .saler-row.free .saler-name { color: #4ab200; } body.punchy #idag .saler-row.busy .saler-name { color: #ff5252; } body.punchy #idag .saler-row .saler-detail { color: #666; } /* I DAG — hero + legend */ body.punchy #idag .hero-greeting { color: #4ab200; } body.punchy #idag .hero-greeting .h-soft { color: #555; } body.punchy #idag .hero-date { color: #666; } body.punchy #idag .hero-stat-val { color: #4ab200; } body.punchy #idag .hero-stat-label { color: #555; } body.punchy #idag .legend { border-color: #2a2a2a; } body.punchy #idag .legend-item { color: #555; } body.punchy #idag .finished-summary { color: #555; } body.punchy #idag .finished-summary:hover { color: #888; } /* PROGRAM — GitHub-palett */ body.punchy #program .dc { background: #0d1117; border-color: #21262d; } body.punchy #program .dc:hover { border-color: #30363d; } body.punchy #program .dc-label { color: #484f58; } body.punchy #program .dc-value { color: #58a6ff; } body.punchy #program .dc-value.green { color: #3fb950; } body.punchy #program .dc-value.orange { color: #d29922; } body.punchy #program .dc-value.red { color: #f85149; } body.punchy #program .dc-sub { color: #484f58; } body.punchy #program .dc-bar { background: #21262d; } body.punchy #program .prog-toolbar-group { background: #0d1117; border-color: #21262d; } body.punchy #program .tb { color: #8b949e; } body.punchy #program .tb:hover { color: #c9d1d9; } body.punchy #program .tb.on { background: #58a6ff; color: #0d1117; } body.punchy #program .prog-tbl { background: #0d1117; border-color: #21262d; } body.punchy #program .prog-tbl th { background: #0d1117; border-color: #21262d; color: #484f58; } body.punchy #program .prog-tbl td { border-color: #161b22; } body.punchy #program .prog-tbl tr:hover { background: #161b22; } body.punchy #program .prog-tbl tr.p-sold { border-left-color: #3fb950; } body.punchy #program .prog-tbl tr.p-good { border-left-color: #3fb950; } body.punchy #program .prog-tbl tr.p-low { border-left-color: #f85149; background: rgba(248, 81, 73, 0.04); } body.punchy #program .prog-tbl .p-date { color: #8b949e; } body.punchy #program .prog-tbl .p-time { color: #8b949e; } body.punchy #program .prog-tbl .p-title { color: #c9d1d9; } body.punchy #program .prog-tbl .p-room { color: #8b949e; } body.punchy #program .prog-tbl tr.p-detail td { background: #161b22; } body.punchy #program .hood-meta { color: #8b949e; } body.punchy #program .hood-meta strong { color: #c9d1d9; } body.punchy #program .hood-tt-name { color: #8b949e; } body.punchy #program .hood-tt-bar { background: #21262d; } body.punchy #program .hood-totals { color: #8b949e; border-color: #21262d; } body.punchy #program .hood-totals strong { color: #c9d1d9; } body.punchy #program .hood-totals .net strong { color: #3fb950; } body.punchy #program .hood-caps { color: #8b949e; } body.punchy #program .hood-caps .ok { color: #3fb950; } body.punchy #program .hood-issues { color: #d29922; } body.punchy #program .prog-link.tc { color: #3fb950; border-color: rgba(63, 185, 80, 0.4); background: rgba(63, 185, 80, 0.10); } body.punchy #program .prog-link.lh { color: #f0883e; border-color: rgba(240, 136, 62, 0.4); background: rgba(240, 136, 62, 0.10); } body.punchy #program .prog-link.san { color: #58a6ff; border-color: rgba(88, 166, 255, 0.4); background: rgba(88, 166, 255, 0.10); } body.punchy #program .prog-link.mom { color: #bc8cff; border-color: rgba(188, 140, 255, 0.4); background: rgba(188, 140, 255, 0.10); } /* NERD — samme palett */ body.punchy #nerd .nerd-btn { background: #0d1117; border-color: #21262d; color: #8b949e; } body.punchy #nerd .nerd-btn:hover { color: #c9d1d9; } body.punchy #nerd .nerd-btn.active { background: #58a6ff; border-color: #58a6ff; color: #0d1117; } body.punchy #nerd .nerd-summary { color: #8b949e; } body.punchy #nerd .nerd-tbl thead th { color: #484f58; border-color: #21262d; } body.punchy #nerd .nerd-tbl tbody td { border-color: #161b22; } body.punchy #nerd .nerd-tbl tbody tr:hover { background: #161b22; } body.punchy #nerd .nerd-tbl tr.n-detail td { background: #161b22; } body.punchy #nerd .match-OK { color: #3fb950; } body.punchy #nerd .match-ROOM, body.punchy #nerd .match-TIME, body.punchy #nerd .match-ENDTIME { color: #d29922; } body.punchy #nerd .match-ORPHAN { color: #f85149; } body.punchy #nerd .match-NOT_PUBLISHED { color: #bc8cff; } body.punchy #nerd .stream-tag { background: rgba(63, 185, 80, 0.20); color: #3fb950; } body.punchy #nerd .stream-missing { background: rgba(248, 81, 73, 0.20); color: #f85149; } body.punchy #nerd .n-diff-san { color: #58a6ff; } body.punchy #nerd .n-diff-mom { color: #bc8cff; } body.punchy #nerd .n-diff-mismatch { color: #d29922; } body.punchy #nerd .n-diff-label { color: #484f58; } body.punchy #nerd .n-meta { color: #8b949e; } body.punchy #nerd .n-meta strong { color: #c9d1d9; } /* ROM (Riverton/Leiligheten/Booking) */ body.punchy .week-nav-btn { background: #1a1a1a; border-color: #333; color: #ccc; } body.punchy .week-nav-btn:hover { background: #222; border-color: #4ab200; } body.punchy .week-nav-today.on { background: #4ab200; color: #111; border-color: #4ab200; } body.punchy .week-nav-label strong { color: #eee; } body.punchy .week-nav-range { color: #666; } body.punchy .booking-form { background: #1a1a1a; border-color: #252525; } body.punchy .booking-form .fg label { color: #666; } body.punchy .booking-form .fg input { background: #222; border-color: #333; color: #ddd; } body.punchy .booking-form .fg input:focus { border-color: #4ab200; box-shadow: 0 0 0 3px rgba(74, 178, 0, 0.15); } body.punchy .book-btn { background: #4ab200; border-color: #4ab200; color: #111; } body.punchy .book-btn:hover { background: #5ac210; border-color: #5ac210; } body.punchy .cal { border-color: #2a2a2a; } body.punchy .cal-header { background: #1a1a1a; } body.punchy .cal-h { background: #1a1a1a; color: #555; } body.punchy .cal-h.today { color: #4ab200; background: rgba(74, 178, 0, 0.08); } body.punchy .cal-body { background: #2a2a2a; } body.punchy .cal-times { background: #1a1a1a; } body.punchy .cal-time { background: #1a1a1a; color: #555; border-color: #2a2a2a; } body.punchy .cal-day { background: #1a1a1a; } body.punchy .cal-day.today-col { background: rgba(74, 178, 0, 0.04); } body.punchy .cal-hour-line { background: #2a2a2a; } body.punchy .cal-block { background: rgba(74, 178, 0, 0.10); border-left-color: #4ab200; color: #4ab200; } body.punchy .cal-block.int { background: rgba(0, 188, 212, 0.10); border-left-color: #00bcd4; color: #00bcd4; } body.punchy .cal-block.purple { background: rgba(188, 140, 255, 0.10); border-left-color: #bc8cff; color: #bc8cff; } /* BOOKING — pills */ body.punchy #booking .room-pill { background: #1a1a1a; border-color: #333; color: #ccc; } body.punchy #booking .room-pill:hover { background: #222; border-color: #4ab200; } body.punchy #booking .room-pill.active { background: #4ab200; color: #111; border-color: #4ab200; } /* SKELETON */ body.punchy .skel-card, body.punchy .skel-row, body.punchy .skel-pill { background: linear-gradient(90deg, #161b22 0%, #21262d 50%, #161b22 100%); background-size: 200% 100%; } /* LOADING */ body.punchy .loading-msg { color: #555; }