/*!
 * fp-theme.css — B/W global tokens + minimal toggle
 * This file controls SITE-WIDE colors (not just the project renderer).
 * It does NOT try to style Astra header/menu aggressively (to avoid conflicts).
 */

:root{
  /* B/W palette */
  --fp-bg: #ffffff;
  --fp-surface: #ffffff;
  --fp-text: #111111;
  --fp-muted: #444444;
  --fp-border: #e6e6e6;

  /* spacing scale (Fibonacci-ish) */
  --s1: 8px;
  --s2: 13px;
  --s3: 21px;
  --s4: 34px;
  --s5: 55px;

  color-scheme: light;
}

html[data-theme="dark"]{
  --fp-bg: #0b0b0b;
  --fp-surface: #121212;
  --fp-text: #f5f5f5;
  --fp-muted: #c8c8c8;
  --fp-border: #2a2a2a;

  color-scheme: dark;
}

/* Apply tokens to body (light touch so Astra can still do its job) */
body{
  background: var(--fp-bg);
  color: var(--fp-text);
}

/* ---- Theme toggle (floating) ---- */
.fp-theme-float{
  position: fixed;
  left: calc(14px + env(safe-area-inset-left));
  bottom: calc(14px + env(safe-area-inset-bottom));
  z-index: 999999;
}

.fp-toggle{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid var(--fp-border);
  background: var(--fp-surface);
  color: var(--fp-text);
  font-weight: 800;
  font-size: 13px;
  line-height: 1;
  box-shadow: 0 10px 22px rgba(0,0,0,.10);
}

html[data-theme="dark"] .fp-toggle{
  box-shadow: 0 10px 22px rgba(0,0,0,.45);
}

.fp-toggle__icon{
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: var(--fp-text);
  opacity: .9;
}

html[data-theme="dark"] .fp-toggle__icon{
  background: var(--fp-text);
  opacity: .85;
}

/* label is "روز/شب" */
.fp-toggle__label{
  user-select:none;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  *{ scroll-behavior:auto !important; }
}