/* SEO Monitor Hub — dashboard & blog typography (v46)
   Scope: user dashboard (.workspace), admin / assistant / representative dashboards
   (.admin-page) and the blog (.blog-page). Public marketing pages are left untouched.
   Fonts load from Google Fonts (already allowed by the CSP); every stack falls back to
   system fonts, so a blocked request only changes the typeface, never the layout. */

:root {
  --font-ui: "Inter", "IBM Plex Sans Arabic", "Segoe UI", system-ui, -apple-system, "Noto Sans Arabic", Tahoma, Arial, sans-serif;
  --font-ui-ar: "IBM Plex Sans Arabic", "Inter", "Segoe UI", "Noto Sans Arabic", Tahoma, Arial, system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
}

:is(.workspace, .admin-page, .blog-page) {
  font-family: var(--font-ui);
  font-optical-sizing: auto;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "kern" 1, "liga" 1;
}
html[lang="ar"] :is(.workspace, .admin-page, .blog-page),
:is(.workspace, .admin-page, .blog-page)[dir="rtl"] {
  font-family: var(--font-ui-ar);
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
}
/* Form controls and buttons do not inherit by default. */
:is(.workspace, .admin-page, .blog-page) :is(button, input, select, textarea) { font-family: inherit; }

/* Hierarchy: clear weight steps, tighter display headings, relaxed Arabic leading. */
:is(.workspace, .admin-page) :is(h1, h2, h3, h4) { font-weight: 700; letter-spacing: -0.012em; text-wrap: balance; }
:is(.workspace, .admin-page) h1 { line-height: 1.3; letter-spacing: -0.02em; }
:is(.workspace, .admin-page) h2 { line-height: 1.35; }
:is(.workspace, .admin-page) h3 { font-weight: 650; line-height: 1.4; }
html[lang="ar"] :is(.workspace, .admin-page) :is(h1, h2, h3, h4) { letter-spacing: 0; line-height: 1.5; }
:is(.workspace, .admin-page) :is(p, li) { line-height: 1.8; }
:is(.workspace, .admin-page) p { text-wrap: pretty; }

/* Small uppercase-style labels: readable size, no forced tracking in Arabic. */
:is(.workspace, .admin-page) :is(.eyebrow, .hero-kicker, .ws-nav-title, .ws-site-label) { font-weight: 700; letter-spacing: 0.04em; }
html[lang="ar"] :is(.workspace, .admin-page) :is(.eyebrow, .hero-kicker, .ws-nav-title, .ws-site-label) { letter-spacing: 0; }

/* Numbers line up in KPI tiles, tables and billing. */
:is(.workspace, .admin-page) :is(table, .ov-kpis strong, .ov-ring strong, .admin-stat strong, [class*="kpi"], [class*="amount"], [class*="balance"]) {
  font-variant-numeric: tabular-nums lining-nums;
}
:is(.workspace, .admin-page) table { font-size: 13px; }
:is(.workspace, .admin-page) th { font-weight: 650; font-size: 12px; letter-spacing: 0.01em; }
:is(.workspace, .admin-page) td { line-height: 1.6; }
:is(.workspace, .admin-page) :is(code, kbd, pre, .mono) { font-family: var(--font-mono); font-size: 0.92em; }

/* Buttons & inputs: consistent weight and size. */
:is(.workspace, .admin-page) .btn { font-weight: 650; letter-spacing: 0; }
:is(.workspace, .admin-page) :is(input, select, textarea) { font-size: 14px; line-height: 1.5; }
:is(.workspace, .admin-page) label { font-weight: 600; font-size: 13px; }
:is(.workspace, .admin-page) :is(input, textarea)::placeholder { font-weight: 400; opacity: 0.7; }
/* Icon-only "add" buttons: a square, centred target. */
:is(.workspace, .admin-page) .btn:has(> svg:only-child),
:is(.workspace, .admin-page) .btn:has(> svg + .sr-only:last-child) { min-width: 44px; padding-inline: 12px; }
:is(.workspace, .admin-page) .settings-action:has(> svg:only-child) { display: inline-grid; place-items: center; width: 34px; height: 34px; padding: 0; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* Admin top bar: wrap cleanly with the shorter role-based labels. */
.admin-page .admin-topbar { gap: 14px 20px; flex-wrap: wrap; }
.admin-page .admin-topbar h1 { font-size: clamp(22px, 2.6vw, 30px); }
.admin-page .admin-top-actions { gap: 8px; flex-wrap: wrap; align-items: center; }
.admin-page .admin-live { font-size: 12px; font-weight: 600; }

/* Blog: comfortable long-form reading. */
.blog-page { font-size: 17px; }
.blog-page :is(h1, h2, h3, h4) { font-weight: 750; line-height: 1.3; letter-spacing: -0.018em; text-wrap: balance; }
html[lang="ar"] .blog-page :is(h1, h2, h3, h4) { letter-spacing: 0; line-height: 1.55; }
.blog-page h1 { font-size: clamp(28px, 4.2vw, 42px); }
.blog-page :is(.blog-article-body, .blog-content, article) :is(p, li) { font-size: 1.0625rem; line-height: 1.95; max-width: 72ch; }
.blog-page :is(.blog-article-body, .blog-content, article) :is(h2, h3) { margin-block: 1.8em 0.6em; }
.blog-page :is(.blog-card-body h2, .blog-card-body h3) { font-size: 1.15rem; line-height: 1.5; }
.blog-page :is(.blog-card-meta, .blog-meta, time, .blog-breadcrumb) { font-size: 0.82rem; font-weight: 500; }
.blog-page :is(blockquote) { font-weight: 500; line-height: 1.9; }
.blog-page :is(code, pre) { font-family: var(--font-mono); }
