/* ==========================================================================
   THUI — Base  (light reset + base typography; safe to load site-wide)
   Scoped-friendly: only sets sensible defaults, won't fight WooCommerce/Elementor.
   ========================================================================== */
.thui, .thui * { box-sizing: border-box; }

.thui {
  font-family: var(--thui-font-sans);
  color: var(--thui-color-text);
  font-size: var(--thui-fs-base);
  line-height: var(--thui-lh-normal);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

.thui h1, .thui h2, .thui h3, .thui h4 {
  font-family: var(--thui-font-display);
  color: var(--thui-color-ink);
  line-height: var(--thui-lh-tight);
  letter-spacing: var(--thui-ls-tight);
  margin: 0;
}
.thui p { margin: 0; }
.thui a { color: var(--thui-color-primary-ink); text-decoration: none; transition: color var(--thui-dur-fast) var(--thui-ease); }
.thui a:hover { color: var(--thui-color-primary); }
.thui img { max-width: 100%; height: auto; display: block; }

/* Accessible focus — one consistent ring everywhere */
.thui :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--thui-color-focus);
  outline-offset: 2px;
  border-radius: 4px;
}

.thui ::selection { background: var(--thui-amber); color: var(--thui-color-accent-ink); }

/* RTL: components use logical properties; this flips text alignment defaults */
[dir="rtl"] .thui { text-align: right; }