/* FA SEO Pro v3 — style.css */
:root {
  --fsp-bg:      #07090f;
  --fsp-bg2:     #0d1117;
  --fsp-bg3:     #111622;
  --fsp-border:  rgba(255,255,255,.07);
  --fsp-border2: rgba(255,255,255,.13);
  --fsp-text:    #e2e8f0;
  --fsp-muted:   rgba(226,232,240,.45);
  --fsp-gold:    #c8a55a;
  --fsp-gold2:   #e8c27a;
  --fsp-gold-d:  rgba(200,165,90,.12);
  --fsp-green:   #4ade80;
  --fsp-yellow:  #facc15;
  --fsp-red:     #f87171;
  --fsp-blue:    #60a5fa;
  --fsp-mono:    'Fira Code','Courier New',monospace;
  --fsp-sans:    'Vazirmatn',Tahoma,sans-serif;
  --fsp-r:       14px;
  --fsp-r2:      20px;
}

/* ── wrap ── */
.fsp-wrap {
  font-family: var(--fsp-sans);
  background: var(--fsp-bg);
  color: var(--fsp-text);
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid var(--fsp-border2);
  box-shadow: 0 30px 80px rgba(0,0,0,.5);
  max-width: 1100px;
  margin: 0 auto;
  direction: rtl;
}

/* ── topbar ── */
.fsp-topbar {
  background: #111722;
  border-bottom: 1px solid var(--fsp-border);
  padding: 12px 22px;
  display: flex;
  align-items: center;
  gap: 14px;
  direction: ltr;
}
.fsp-dots { display:flex; gap:6px; }
.fsp-dots span {
  width:12px; height:12px; border-radius:50%;
}
.fsp-dots span:nth-child(1) { background:#ff5f57; }
.fsp-dots span:nth-child(2) { background:#febc2e; }
.fsp-dots span:nth-child(3) { background:#28c840; }
.fsp-path {
  font-family: var(--fsp-mono); font-size:.72rem;
  color: rgba(255,255,255,.3); flex:1;
}
.fsp-path em { color: var(--fsp-gold); font-style:normal; }
.fsp-badge {
  font-family: var(--fsp-mono); font-size:.62rem;
  color: var(--fsp-gold);
  background: var(--fsp-gold-d);
  border:1px solid rgba(200,165,90,.2);
  padding:3px 10px; border-radius:4px;
  letter-spacing:1px;
}

/* ── hero ── */
.fsp-hero {
  padding: 50px 30px 40px;
  text-align: center;
  position: relative;
  background: radial-gradient(ellipse at 50% 0%, rgba(200,165,90,.04) 0%, transparent 60%);
}
.fsp-title {
  font-size: clamp(1.8rem,4vw,3rem);
  font-weight: 900;
  letter-spacing: -1.5px;
  color: #fff;
  margin-bottom: 10px;
}
.fsp-title em { color: var(--fsp-gold); font-style:normal; }
.fsp-sub {
  font-size: .92rem; color: var(--fsp-muted);
  font-weight:300; margin-bottom: 30px;
}

/* ── robot ── */
.fsp-robot {
  display: flex;
  justify-content: center;
  margin-bottom: 24px;
}
.fsp-robot-body {
  width: 72px; height: 72px;
  background: linear-gradient(135deg,#1a2035,#0d1117);
  border: 2px solid var(--fsp-gold);
  border-radius: 18px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 20px var(--fsp-gold-d);
  transition: all .3s;
}
.fsp-wrap.scanning .fsp-robot-body {
  animation: fsp-robot-pulse 1.2s ease-in-out infinite;
  box-shadow: 0 0 30px rgba(200,165,90,.3);
}
@keyframes fsp-robot-pulse {
  0%,100%{transform:scale(1);}
  50%{transform:scale(1.06);}
}
.fsp-antenna {
  position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  width:3px; height:14px; background:var(--fsp-gold); border-radius:2px;
}
.fsp-antenna::after {
  content:''; position:absolute; top:-5px; left:50%; transform:translateX(-50%);
  width:8px; height:8px; border-radius:50%;
  background:var(--fsp-gold);
  animation: fsp-blink 1.5s ease-in-out infinite;
}
@keyframes fsp-blink { 0%,100%{opacity:1;} 50%{opacity:.2;} }
.fsp-ear {
  position:absolute; top:50%; transform:translateY(-50%);
  width:8px; height:20px; background:#1a2035;
  border:2px solid var(--fsp-gold); border-radius:4px;
}
.fsp-ear-l { right:-10px; } .fsp-ear-r { left:-10px; }
.fsp-eyes { display:flex; gap:12px; align-items:center; }
.fsp-eye {
  width:14px; height:14px; border-radius:50%;
  background: var(--fsp-blue);
  box-shadow: 0 0 8px var(--fsp-blue);
  transition: background .3s;
}
.fsp-wrap.scanning .fsp-eye { background:var(--fsp-green); box-shadow:0 0 8px var(--fsp-green); animation:fsp-eye-scan .6s ease-in-out infinite alternate; }
.fsp-wrap.done .fsp-eye { background:var(--fsp-gold); box-shadow:0 0 8px var(--fsp-gold); }
@keyframes fsp-eye-scan { from{transform:translateX(0)} to{transform:translateX(2px)} }
.fsp-mouth {
  position:absolute; bottom:12px; left:50%; transform:translateX(-50%);
  width:20px; height:4px; background:var(--fsp-muted);
  border-radius:3px; transition: all .3s;
}
.fsp-wrap.scanning .fsp-mouth { background:var(--fsp-green); box-shadow:0 0 6px var(--fsp-green); }
.fsp-wrap.done .fsp-mouth { background:var(--fsp-gold); width:24px; }
.fsp-signal {
  position:absolute; top:8px; right:8px;
  width:6px; height:6px; border-radius:50%;
  background:#333; transition:all .3s;
}
.fsp-wrap.scanning .fsp-signal { background:var(--fsp-green); animation:fsp-blink .8s infinite; box-shadow:0 0 6px var(--fsp-green); }

/* ── input ── */
.fsp-input-row { display:flex; justify-content:center; margin-bottom:20px; }
.fsp-input-box {
  display:flex; align-items:center; gap:10px;
  background:#0d1220;
  border:1.5px solid rgba(200,165,90,.25);
  border-radius:12px;
  padding:12px 18px;
  width:100%; max-width:640px;
  transition: border-color .3s, box-shadow .3s;
}
.fsp-input-box:focus-within {
  border-color:var(--fsp-gold);
  box-shadow:0 0 0 3px var(--fsp-gold-d);
}
.fsp-prompt {
  font-family:var(--fsp-mono); font-size:1rem;
  color:var(--fsp-gold); font-weight:600; flex-shrink:0;
}
.fsp-domain {
  flex:1; background:transparent; border:none; outline:none;
  font-family:var(--fsp-mono); font-size:.95rem;
  color:#fff; direction:ltr;
}
.fsp-domain::placeholder { color:rgba(255,255,255,.2); }
.fsp-btn {
  display:flex; align-items:center; gap:7px;
  background: linear-gradient(135deg,#c8a55a,#a87c34);
  color:#000; border:none; padding:9px 22px;
  border-radius:8px; font-family:var(--fsp-sans);
  font-size:.88rem; font-weight:700; cursor:pointer;
  white-space:nowrap; transition:all .25s; flex-shrink:0;
}
.fsp-btn:hover:not(:disabled) { filter:brightness(1.12); transform:translateY(-1px); }
.fsp-btn:disabled { opacity:.55; cursor:not-allowed; transform:none; }

/* ── checks strip ── */
.fsp-checks-strip {
  display:flex; flex-wrap:wrap; justify-content:center; gap:8px;
  font-size:.68rem; color:var(--fsp-muted);
  font-family:var(--fsp-mono);
}

/* ── progress ── */
.fsp-progress { display:none; padding:0 30px 30px; }
.fsp-progress.show { display:block; }
.fsp-prog-bar-wrap {
  height:4px; background:rgba(255,255,255,.06);
  border-radius:2px; overflow:hidden; margin-bottom:18px;
}
.fsp-prog-fill {
  height:100%; width:0;
  background:linear-gradient(to right,var(--fsp-gold),var(--fsp-green));
  transition:width .5s ease; border-radius:2px;
}
.fsp-prog-steps { display:flex; flex-direction:column; gap:6px; }
.fsp-prog-line {
  display:flex; align-items:center; gap:10px;
  font-family:var(--fsp-mono); font-size:.75rem; color:var(--fsp-muted);
  opacity:0; animation:fsp-line-in .3s ease forwards;
}
@keyframes fsp-line-in { from{opacity:0;transform:translateX(8px)} to{opacity:1;transform:none} }
.fsp-prog-line.done { color:rgba(74,222,128,.6); }
.fsp-prog-line.active { color:var(--fsp-gold); }
.fsp-pdot {
  width:7px; height:7px; border-radius:50%;
  background:currentColor; flex-shrink:0;
}
.fsp-prog-line.active .fsp-pdot { animation:fsp-blink .7s infinite; }

/* ── error ── */
.fsp-error {
  display:none; margin:0 30px 20px;
  background:rgba(248,113,113,.1);
  border:1px solid rgba(248,113,113,.3);
  border-radius:10px; padding:14px 18px;
  font-size:.85rem; color:var(--fsp-red);
  font-family:var(--fsp-mono);
}
.fsp-error.show { display:block; }

/* ── results ── */
.fsp-results { padding:0 24px 32px; }

/* site header */
.fsp-site-header {
  background: linear-gradient(135deg,#111825,#0d1117);
  border:1px solid var(--fsp-border2);
  border-radius:16px; padding:22px 26px;
  margin-bottom:22px;
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:14px;
}
.fsp-domain-info h2 {
  font-size:1.2rem; font-weight:800; color:#fff;
  margin-bottom:4px; direction:ltr; text-align:left;
}
.fsp-domain-info p {
  font-family:var(--fsp-mono); font-size:.68rem; color:var(--fsp-muted);
}
.fsp-overall-ring {
  display:flex; flex-direction:column; align-items:center; gap:4px;
}
.fsp-ring-svg { transform:rotate(-90deg); }
.fsp-ring-bg { fill:none; stroke:rgba(255,255,255,.07); stroke-width:8; }
.fsp-ring-fg { fill:none; stroke-width:8; stroke-linecap:round; transition:stroke-dashoffset 1.2s ease; }
.fsp-ring-label {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  font-family:var(--fsp-sans); font-size:1.4rem; font-weight:900; color:#fff;
  line-height:1;
}
.fsp-ring-wrap { position:relative; display:inline-block; }
.fsp-ring-sub { font-family:var(--fsp-mono); font-size:.6rem; color:var(--fsp-muted); letter-spacing:1px; }

/* score cards */
.fsp-scores {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
  gap:12px; margin-bottom:22px;
}
.fsp-score-card {
  background:var(--fsp-bg2); border:1px solid var(--fsp-border);
  border-radius:12px; padding:14px 12px; text-align:center;
  position:relative; overflow:hidden; transition:transform .25s;
}
.fsp-score-card:hover { transform:translateY(-3px); }
.fsp-score-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
}
.fsp-sc-num {
  font-family:var(--fsp-sans); font-size:1.9rem;
  font-weight:900; line-height:1; margin-bottom:5px;
}
.fsp-sc-label {
  font-family:var(--fsp-mono); font-size:.6rem;
  color:var(--fsp-muted); letter-spacing:1.5px;
}

/* cards grid */
.fsp-cards-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:16px; margin-bottom:22px;
}
.fsp-card {
  background:var(--fsp-bg2); border:1px solid var(--fsp-border);
  border-radius:16px; overflow:hidden;
  transition:transform .3s, border-color .3s, box-shadow .3s;
}
.fsp-card:hover {
  transform:translateY(-4px);
  border-color:var(--fsp-border2);
  box-shadow:0 16px 40px rgba(0,0,0,.3);
}
.fsp-card-head {
  padding:14px 18px;
  background:#111825;
  border-bottom:1px solid var(--fsp-border);
  display:flex; align-items:center; justify-content:space-between;
}
.fsp-card-title {
  font-size:.88rem; font-weight:700;
  display:flex; align-items:center; gap:8px;
}
.fsp-card-status {
  font-family:var(--fsp-mono); font-size:.62rem;
  padding:3px 10px; border-radius:20px; font-weight:600;
}
.fsp-st-ok   { background:rgba(74,222,128,.12); color:var(--fsp-green); border:1px solid rgba(74,222,128,.25); }
.fsp-st-med  { background:rgba(250,204,21,.1);  color:var(--fsp-yellow);border:1px solid rgba(250,204,21,.25); }
.fsp-st-bad  { background:rgba(248,113,113,.1); color:var(--fsp-red);   border:1px solid rgba(248,113,113,.25); }
.fsp-card-rows { padding:4px 0; }
.fsp-row {
  display:flex; align-items:flex-start; justify-content:space-between;
  padding:9px 18px; gap:10px;
  border-bottom:1px solid rgba(255,255,255,.04);
  font-size:.78rem;
}
.fsp-row:last-child { border-bottom:none; }
.fsp-row-key { color:var(--fsp-muted); flex-shrink:0; min-width:100px; }
.fsp-row-val {
  text-align:left; direction:ltr;
  font-family:var(--fsp-mono); font-size:.73rem;
  word-break:break-all; max-width:220px;
}
.fsp-rv-ok   { color:var(--fsp-green); }
.fsp-rv-warn { color:var(--fsp-yellow); }
.fsp-rv-err  { color:var(--fsp-red); }

/* tips */
.fsp-tips-section {
  background:var(--fsp-bg2); border:1px solid var(--fsp-border);
  border-radius:16px; overflow:hidden; margin-bottom:22px;
}
.fsp-tips-head {
  padding:14px 20px;
  background:#111825;
  border-bottom:1px solid var(--fsp-border);
  font-size:.9rem; font-weight:700;
  display:flex; align-items:center; gap:8px;
}
.fsp-tips-list { padding:8px 0; }
.fsp-tip {
  display:flex; align-items:flex-start; gap:14px;
  padding:13px 20px;
  border-bottom:1px solid rgba(255,255,255,.04);
  font-size:.82rem; transition:background .2s;
}
.fsp-tip:last-child { border-bottom:none; }
.fsp-tip:hover { background:rgba(255,255,255,.02); }
.fsp-tip-pri {
  flex-shrink:0; padding:3px 9px; border-radius:4px;
  font-family:var(--fsp-mono); font-size:.58rem; font-weight:700; margin-top:1px;
}
.fsp-pri-high { background:rgba(248,113,113,.12); color:var(--fsp-red); border:1px solid rgba(248,113,113,.25); }
.fsp-pri-med  { background:rgba(250,204,21,.1);  color:var(--fsp-yellow); border:1px solid rgba(250,204,21,.25); }
.fsp-pri-low  { background:rgba(96,165,250,.1);  color:var(--fsp-blue); border:1px solid rgba(96,165,250,.2); }
.fsp-tip-body { flex:1; }
.fsp-tip-title { font-weight:700; color:#fff; margin-bottom:4px; }
.fsp-tip-desc  { color:var(--fsp-muted); line-height:1.65; font-size:.78rem; }

/* actions */
.fsp-actions {
  display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-start;
}
.fsp-action-btn {
  background:rgba(255,255,255,.05); border:1px solid var(--fsp-border2);
  color:var(--fsp-text); padding:9px 20px; border-radius:8px;
  font-family:var(--fsp-sans); font-size:.82rem;
  cursor:pointer; transition:all .2s;
}
.fsp-action-btn:hover { background:rgba(200,165,90,.1); border-color:var(--fsp-gold); color:var(--fsp-gold); }

/* ── score colors ── */
.fsp-score-great { color:var(--fsp-green); }
.fsp-score-good  { color:#a3e635; }
.fsp-score-mid   { color:var(--fsp-yellow); }
.fsp-score-low   { color:#fb923c; }
.fsp-score-bad   { color:var(--fsp-red); }

/* ── print ── */
@media print {
  .fsp-topbar, .fsp-hero, .fsp-progress,
  .fsp-actions, .fsp-error { display:none !important; }
  .fsp-wrap { box-shadow:none; border:none; }
  .fsp-results { display:block !important; }
  .fsp-card { break-inside:avoid; }
}

/* ── responsive ── */
@media (max-width:700px) {
  .fsp-hero { padding:35px 18px 28px; }
  .fsp-results { padding:0 14px 24px; }
  .fsp-cards-grid { grid-template-columns:1fr; }
  .fsp-scores { grid-template-columns:repeat(3,1fr); }
  .fsp-site-header { flex-direction:column; align-items:flex-start; }
  .fsp-input-box { flex-wrap:wrap; gap:8px; }
  .fsp-btn { width:100%; justify-content:center; }
}
@media (max-width:480px) {
  .fsp-scores { grid-template-columns:repeat(2,1fr); }
  .fsp-row-val { max-width:150px; }
  .fsp-title { font-size:1.6rem; }
}
