/* Stiler for ux.js, hvaher.js, legend.js og intro.js */

/* ---------- Sidepanel skjult (bare PC) ---------- */
/* style.css skjuler panelet uansett skjermbredde; på mobil skal bunnpanelet alltid finnes */
@media (max-width: 760px) {
  body.side-hidden .panel { display: flex; }
}
@media (min-width: 761px) {
  body.side-hidden .panel { display: none; }
}

/* ---------- Hurtigmeny ---------- */
.ctx-menu button { color: var(--ink); }
.ctx-menu button:focus { outline: none; }
.ctx-menu button:focus-visible { background: var(--surface-2); box-shadow: inset 3px 0 0 var(--accent); outline: none; }
.ctx-menu button:active { background: var(--line); }

/* ---------- Dialog for hurtigtaster ---------- */
.ek-dlg { position: fixed; inset: 0; z-index: 2000; background: rgba(20, 30, 25, .45); display: grid; place-items: center; padding: 16px; }
.ek-dlg[hidden] { display: none; }
.ek-dlg-card {
  background: var(--surface); color: var(--ink); border-radius: var(--radius); box-shadow: var(--shadow);
  max-width: 400px; width: 100%; max-height: calc(100% - 32px); overflow: auto; padding: 18px 20px 16px; border: 1px solid var(--line);
}
.ek-dlg-t { margin: 0 0 12px; font-size: 18px; color: var(--forest); }
.ek-dlg .keys { margin-bottom: 12px; }
.ek-dlg .keys kbd { justify-self: start; min-width: 22px; text-align: center; }
.ek-dlg p { margin: 0 0 14px; }
.ek-dlg .btn.primary { background: var(--accent-strong, #b9480f); border-color: var(--accent-strong, #b9480f); color: #fff; }
.ek-dlg .btn:focus-visible { outline: 2px solid var(--forest); outline-offset: 2px; }

/* ---------- Hva er her? ---------- */
.wh-sec[hidden], .wh-empty[hidden] { display: none; }
.wh-off { margin: 6px 0 2px; padding: 5px 8px; border-radius: 6px; background: #fff4d6; color: #6b4b00; border: 1px solid #f0dca6; }
.wh-err { color: #8a2c0d; }
.wh-retry { color: var(--forest); font-weight: 600; text-decoration: underline; white-space: nowrap; }
.wh-retry:hover { color: var(--accent-strong, #b9480f); }
.wh-shown { display: inline-flex; align-items: center; min-height: 28px; padding: 0 4px; font-style: italic; }

/* ---------- Utskrift: samme kartstørrelse på skjermen som på A4 (186 × 175 mm ≈ 703 × 661 px) ---------- */
@media screen {
  body.printing .panel, body.printing .map-tools, body.printing .layer-panel, body.printing .legend-card,
  body.printing .modebar, body.printing .cursor-coord, body.printing .leaflet-control-zoom,
  body.printing .leaflet-popup-pane, body.printing .ctx-menu, body.printing .ek-dlg { display: none !important; }
  body.printing .layout { justify-content: center; align-items: flex-start; overflow: auto; }
  body.printing .map-wrap { flex: none; width: 703px; height: 661px; max-width: none; }
}
@media print {
  body.printing .ek-dlg { display: none !important; }
}