/* ===== EDUFARGO — token tema bersama (terang / gelap) ===== */
@font-face { font-family: "Fredoka"; src: url("/static/fonts/fredoka.woff2") format("woff2"); font-weight: 300 700; font-display: swap; }
@font-face { font-family: "Nunito"; src: url("/static/fonts/nunito.woff2") format("woff2"); font-weight: 200 1000; font-display: swap; }

:root, [data-theme="light"] {
  --bg: #f4f7f1; --bg2: #eaf2e4; --card: #ffffff; --line: #dfe8dc; --line2: #cddbc9;
  --text: #173a33; --muted: #5d7a70; --faint: #8aa197;
  --green: #55a845; --green-d: #3e8a31; --teal: #12625a; --teal-d: #0c4741; --blue: #4594d3; --yellow: #f9b21b;
  --accent: #12625a; --accent-ink: #ffffff;
  --temp: #e8892b; --rh: #3d8ccc; --lux: #d9a20b;
  --on-bg: #e3f3dc; --on-ink: #2f7d25; --pause-bg: #e1eef9; --pause-ink: #2a6aa0;
  --off-bg: #edf1ec; --off-ink: #7b8f86;
  --warn-bg: #fff2d1; --warn-ink: #8a5a00; --bad-bg: #fde4e1; --bad-ink: #a5372b;
  --input: #ffffff; --shadow: 0 1px 2px rgba(18, 98, 90, .06), 0 6px 18px rgba(18, 98, 90, .06);
  --band: #12625a; --band-ink: #e9f6ef;
  color-scheme: light;
}
[data-theme="dark"] {
  --bg: #0d1916; --bg2: #11211d; --card: #152520; --line: #22372f; --line2: #2c463c;
  --text: #e5f1ea; --muted: #93ab9f; --faint: #6f877c;
  --green: #7ac76a; --green-d: #5fb04f; --teal: #44b8a3; --teal-d: #2f9a87; --blue: #6cb2e8; --yellow: #f9b21b;
  --accent: #44b8a3; --accent-ink: #062520;
  --temp: #f2a65a; --rh: #6cb2e8; --lux: #f0cf5a;
  --on-bg: #1e4729; --on-ink: #9fe58c; --pause-bg: #1b3a4f; --pause-ink: #a2d4f6;
  --off-bg: #1c2f29; --off-ink: #7f978b;
  --warn-bg: #4a3913; --warn-ink: #ffd98a; --bad-bg: #4b1f1d; --bad-ink: #ffb4ac;
  --input: #0f1d19; --shadow: none;
  --band: #0f3c36; --band-ink: #cdeee2;
  color-scheme: dark;
}

/* Logo: versi terang & gelap */
.only-dark { display: none !important; }
[data-theme="dark"] .only-dark { display: inline-block !important; }
[data-theme="dark"] .only-light { display: none !important; }

/* Tombol tema */
.theme-btn {
  font: inherit; font-size: 13px; font-weight: 700; display: inline-flex; align-items: center; gap: 6px;
  border: 1px solid var(--line2); background: var(--card); color: var(--text);
  padding: 6px 12px; border-radius: 999px; cursor: pointer;
}
.theme-btn:hover { border-color: var(--accent); }
.theme-btn svg { width: 16px; height: 16px; }

/* Kamera: tombol & mode layar penuh (lobby dan panel) */
.camwrap { position: relative; }
.camfull-btn, .camclose {
  position: absolute; display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border: 0; border-radius: 10px; cursor: pointer;
  background: rgba(0,0,0,.55); color: #fff; padding: 0;
}
.camfull-btn { right: 10px; bottom: 10px; }
.camfull-btn svg, .camclose svg { width: 20px; height: 20px; }
.camfull-btn:hover, .camclose:hover, .camfull-btn:focus-visible, .camclose:focus-visible { background: rgba(0,0,0,.8); outline: 2px solid #fff; outline-offset: 1px; }
.camclose { display: none; top: 16px; right: 16px; width: 48px; height: 48px; }
.camwrap.is-full { background: #000; display: flex; align-items: center; justify-content: center; }
.camwrap.is-full img { width: 100% !important; height: 100% !important; max-height: none !important; min-height: 0 !important; object-fit: contain !important; border-radius: 0 !important; background: #000 !important; }
.camwrap.is-full .camfull-btn { display: none; }
.camwrap.is-full .camclose { display: flex; }
.camwrap.pseudo-full { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1000; }
body.cam-noscroll { overflow: hidden; }