/* Bygges med Tailwind standalone-CLI til static/css/site.css (se scripts/build.sh). */
@import "tailwindcss" source(none);
@source "../templates";
@source "../content";
@import "./inter.css";

/* Fælles tema (Weircon-wind) */
@import "../vendor/weirsoe-theme/adapters/tailwind.css";
@import "../vendor/weirsoe-theme/weirsoe-theme.css" layer(components);

@theme {
  --font-sans: "Inter Variable", ui-sans-serif, system-ui, -apple-system, sans-serif;
}
html[data-theme="terminal"] {
  --font-sans: ui-monospace, "Cascadia Code", "JetBrains Mono", Menlo, Consolas, monospace;
}
:root { --wt-font-sans: var(--font-sans); }
@layer base { a { color: inherit; } }

/* Samme fade mellem sider som før */
@view-transition { navigation: auto; }

/* Kommandopalette */
.palette-overlay {
  position: fixed; inset: 0; z-index: 100;
  background: color-mix(in srgb, var(--color-bg) 60%, transparent);
  backdrop-filter: blur(4px);
  display: flex; align-items: flex-start; justify-content: center; padding-top: 15vh;
}
.palette-box {
  width: min(36rem, calc(100vw - 2rem));
  border: 1px solid var(--color-border); border-radius: 1rem;
  background: var(--color-surface); box-shadow: 0 24px 64px rgb(0 0 0 / .45);
  overflow: hidden;
}
.palette-input {
  width: 100%; padding: .9rem 1.1rem; font-size: 1rem;
  background: transparent; color: var(--color-text); border: 0; outline: none;
  border-bottom: 1px solid var(--color-border);
}
.palette-list { max-height: 50vh; overflow-y: auto; padding: .35rem; }
.palette-item {
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  padding: .55rem .8rem; border-radius: .6rem; cursor: pointer; font-size: .925rem;
}
.palette-item.is-selected, .palette-item:hover:not(.palette-empty) { background: var(--color-surface-2); }
.palette-empty { color: var(--color-muted); cursor: default; }
.palette-badge {
  font-size: .7rem; color: var(--color-muted);
  border: 1px solid var(--color-border); border-radius: 999px; padding: .05rem .5rem;
}
.palette-hint {
  padding: .5rem 1.1rem; font-size: .72rem; color: var(--color-muted);
  border-top: 1px solid var(--color-border);
}

/* Kodeblokke */
.prose pre { position: relative; }
.tabel { overflow-x: auto; }
.giallo-l { display: inline-block; min-height: 1lh; width: 100%; }
.copy-btn {
  position: absolute; top: .45rem; right: .45rem;
  font-size: .68rem; line-height: 1; padding: .35rem .6rem;
  color: var(--color-muted); background: var(--color-surface-2);
  border: 1px solid var(--color-border); border-radius: .5rem;
  opacity: 0; transition: opacity .15s ease; cursor: pointer;
}
.prose pre:hover .copy-btn, .copy-btn:focus-visible { opacity: 1; }
.copy-btn:hover { color: var(--color-text); }

/* /now */
.heatmap { display: flex; gap: 3px; width: max-content; }
.hm-col { display: flex; flex-direction: column; gap: 3px; }
.hm-cell { width: 11px; height: 11px; border-radius: 2.5px; background: var(--color-surface-2); }
.hm-1 { background: color-mix(in srgb, var(--color-accent) 30%, var(--color-surface-2)); }
.hm-2 { background: color-mix(in srgb, var(--color-accent) 55%, var(--color-surface-2)); }
.hm-3 { background: color-mix(in srgb, var(--color-accent) 80%, var(--color-surface-2)); }
.hm-4 { background: var(--color-accent); }

/* /profiler */
.copy { transition: color 0.15s; }
.copy:hover { color: var(--color-accent); text-decoration: underline; text-underline-offset: 3px; }