/* WinFactory 2.0 design system — base styles (seed). RTL-safe by construction (ADR-006):
   logical properties, no left/right, direction comes from <html dir>. */
*, *::before, *::after { box-sizing: border-box; }

html { font-family: var(--wf-font); font-size: 16px; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--wf-bg);
  color: var(--wf-text);
  line-height: 1.45;
  min-height: 100dvh;
}

/* numbers, dimensions and codes must never flip in RTL text — see i18n.bidi() */
.wf-bidi { unicode-bidi: isolate; direction: ltr; display: inline-block; font-variant-numeric: tabular-nums; }
.wf-mono { font-family: var(--wf-font-mono); }

.wf-shell { display: grid; grid-template-rows: auto 1fr auto; min-height: 100dvh; }
.wf-header {
  display: flex; align-items: center; gap: var(--wf-sp-3);
  padding-block: var(--wf-sp-3); padding-inline: var(--wf-sp-4);
  background: var(--wf-surface); border-block-end: 1px solid var(--wf-border);
}
.wf-header h1 { font-size: var(--wf-fs-lg); margin: 0; font-weight: 600; }
.wf-main { padding-block: var(--wf-sp-6); padding-inline: var(--wf-sp-4); max-inline-size: 960px; inline-size: 100%; margin-inline: auto; }
.wf-footer { padding: var(--wf-sp-3) var(--wf-sp-4); color: var(--wf-text-muted); font-size: var(--wf-fs-sm); }

.wf-card {
  background: var(--wf-surface); border: 1px solid var(--wf-border);
  border-radius: var(--wf-radius-lg); box-shadow: var(--wf-shadow);
  padding: var(--wf-sp-4);
}
.wf-card + .wf-card { margin-block-start: var(--wf-sp-4); }

.wf-btn {
  font: inherit; cursor: pointer; border-radius: var(--wf-radius);
  padding-block: var(--wf-sp-2); padding-inline: var(--wf-sp-4);
  border: 1px solid var(--wf-brand); background: var(--wf-brand); color: #fff;
}
.wf-btn:hover { background: var(--wf-brand-strong); }
.wf-btn:focus-visible, .wf-input:focus-visible, a:focus-visible { outline: none; box-shadow: var(--wf-focus); }
.wf-btn--ghost { background: transparent; color: var(--wf-brand); }

.wf-input {
  font: inherit; color: inherit; background: var(--wf-surface);
  border: 1px solid var(--wf-border); border-radius: var(--wf-radius);
  padding-block: var(--wf-sp-2); padding-inline: var(--wf-sp-3); inline-size: 100%;
}

.wf-chip {
  display: inline-flex; align-items: center; gap: var(--wf-sp-1);
  padding-block: 2px; padding-inline: var(--wf-sp-2);
  border-radius: 999px; font-size: var(--wf-fs-sm); background: var(--wf-surface-2);
}
.wf-chip--ok { background: color-mix(in srgb, var(--wf-success) 15%, transparent); color: var(--wf-success); }
.wf-chip--bad { background: color-mix(in srgb, var(--wf-danger) 15%, transparent); color: var(--wf-danger); }
.wf-chip--warn { background: color-mix(in srgb, var(--wf-warning) 15%, transparent); color: var(--wf-warning); }

.wf-muted { color: var(--wf-text-muted); }
.wf-row { display: flex; flex-wrap: wrap; gap: var(--wf-sp-3); align-items: center; }
.wf-visually-hidden { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip: rect(0 0 0 0); }