#seo-static-page-content {
  display: none;
}

/* Keep the prerendered copy for crawlers and no-JS visitors, but prevent it
   from duplicating the live React page once JavaScript is enabled. */
html.js #seo-static-page-content {
  display: none;
}

/* The homepage keeps its server-rendered snapshot visible until the live
   settings request completes. Hide the React tree meanwhile to avoid a
   duplicate first paint. */
html.seo-static-pending #seo-static-page-content {
  display: block;
}

html.seo-static-pending #root {
  display: none;
}

html.no-js #seo-static-page-content {
  display: block;
}

html.no-js #app-loading-shell {
  display: none;
}

.seo-static-shell {
  box-sizing: border-box;
  max-width: 920px;
  margin: 0 auto;
  padding: 24px 16px;
  color: #1a202c;
  direction: rtl;
  font-family: "Cairo", Arial, sans-serif;
  line-height: 1.8;
}

.seo-static-breadcrumb {
  margin-bottom: 20px;
  color: #718096;
  font-size: 14px;
}

.seo-static-shell img {
  max-width: 100%;
  height: auto;
}

.app-loading-shell {
  display: flex;
  min-height: 100vh;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 12px;
  color: #718096;
  font-family: "Cairo", Arial, sans-serif;
  background: #f7fafc;
}

.app-loading-spinner {
  width: 40px;
  height: 40px;
  border: 4px solid #e2e8f0;
  border-top-color: #1e3a5f;
  border-radius: 50%;
  animation: seo-spinner 0.8s linear infinite;
}

.app-loading-shell p {
  margin: 0;
  font-size: 14px;
}

@keyframes seo-spinner {
  to { transform: rotate(360deg); }
}