/* ════════════════════════════════════════════════════════════════
   Fanus Pricing Module — Styles (v1.0)
   مستقل و namespaced با پیشوند fp- (بدون تداخل با استایل‌های سایت)
   پالت: هم‌خوان با متغیرهای لندینگ (--green-*, --gray-*)
   ════════════════════════════════════════════════════════════════ */

.fp-section{
  padding:96px 20px 80px;
  background:
    radial-gradient(1200px 500px at 85% -10%, rgba(16,185,129,.07), transparent 60%),
    radial-gradient(900px 400px at 10% 110%, rgba(5,150,105,.06), transparent 60%),
    var(--gray-50,#f9fafb);
  scroll-margin-top:84px;
}
.fp-section .fp-head{max-width:720px;margin:0 auto 48px;text-align:center}

.fp-title{
  font-size:clamp(26px,4vw,40px);font-weight:800;line-height:1.35;
  color:var(--gray-900);margin-bottom:12px;
}
.fp-subtitle{font-size:clamp(14px,1.6vw,17px);color:var(--gray-500);line-height:1.9}

/* ── Toggle (پلن‌ها / جدول مقایسه) ─────────────────────────────── */
.fp-toggle{
  display:inline-flex;gap:4px;margin-top:28px;padding:5px;
  background:var(--gray-100);border:1px solid var(--gray-200);
  border-radius:14px;
}
.fp-toggle-btn{
  appearance:none;border:0;cursor:pointer;
  padding:9px 26px;border-radius:10px;
  font-family:inherit;font-size:14px;font-weight:600;color:var(--gray-500);
  background:transparent;transition:all .25s var(--ease,cubic-bezier(.4,0,.2,1));
}
.fp-toggle-btn:hover{color:var(--gray-800)}
.fp-toggle-btn.is-active{
  background:var(--green-600,#059669);color:#fff;
  box-shadow:0 2px 10px rgba(5,150,105,.35);
}

.is-hidden{display:none!important}

/* ── گرید کارت‌ها ──────────────────────────────────────────────── */
.fp-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
  max-width:1200px;margin:0 auto;align-items:stretch;
}
@media(max-width:1080px){.fp-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.fp-grid{grid-template-columns:1fr;max-width:440px}}

/* ── کارت پلن ─────────────────────────────────────────────────── */
.fp-card{
  position:relative;display:flex;flex-direction:column;
  background:#fff;border:1px solid var(--gray-200);border-radius:22px;
  padding:30px 26px 26px;
  box-shadow:0 1px 2px rgba(17,24,39,.04);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);
}
.fp-card:hover{
  transform:translateY(-6px);
  box-shadow:0 20px 45px -18px rgba(6,78,59,.22);
  border-color:var(--green-300);
}

.fp-badge{
  position:absolute;top:-13px;right:50%;transform:translateX(50%);
  padding:5px 16px;border-radius:999px;white-space:nowrap;
  font-size:12px;font-weight:700;
  background:linear-gradient(135deg,var(--green-500),var(--green-600));
  color:#fff;box-shadow:0 4px 14px rgba(5,150,105,.4);
}
.is-featured .fp-badge{
  background:linear-gradient(135deg,#f59e0b,#f97316);
  box-shadow:0 4px 14px rgba(245,158,11,.45);
}

.fp-card-name{font-size:21px;font-weight:800;color:var(--gray-900)}
.fp-card-tagline{font-size:13px;color:var(--gray-500);margin-top:4px;min-height:20px}

/* ── قیمت ── */
.fp-price{margin:20px 0 4px;text-align:center}
.fp-price-row{display:flex;align-items:baseline;justify-content:center;gap:8px}
.fp-price-num{
  font-size:32px;font-weight:900;letter-spacing:-.5px;color:var(--gray-900);
  font-variant-numeric:tabular-nums;
}
.fp-price-unit{font-size:14px;font-weight:600;color:var(--gray-400)}
.fp-price-free{
  background:linear-gradient(135deg,var(--green-500),var(--green-700));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.fp-price-meta{font-size:12.5px;color:var(--gray-500);margin-top:8px}
.fp-price-monthly{
  display:inline-block;margin-top:6px;padding:3px 10px;border-radius:8px;
  font-size:11.5px;font-weight:600;color:var(--green-700);
  background:var(--green-50);
}

/* ── CTA ── */
.fp-cta{
  display:flex;align-items:center;justify-content:center;
  margin:18px 0 0;padding:12px 16px;border-radius:13px;
  font-size:14px;font-weight:700;text-align:center;
  border:1.5px solid var(--green-600);color:var(--green-700);background:#fff;
  transition:all .25s var(--ease);
}
.fp-cta:hover{background:var(--green-50);transform:translateY(-1px)}
.fp-cta-solid{
  background:linear-gradient(135deg,var(--green-500),var(--green-700));
  border-color:transparent;color:#fff;
  box-shadow:0 6px 18px rgba(5,150,105,.35);
}
.fp-cta-solid:hover{
  background:linear-gradient(135deg,var(--green-600),var(--green-800));
  box-shadow:0 10px 24px rgba(5,150,105,.45);color:#fff;
}
.fp-cta-free{border-style:dashed}

/* ── لیست امکانات ── */
.fp-features{list-style:none;margin:22px 0 0;padding:0;flex:1}
.fp-features li{
  display:flex;align-items:flex-start;gap:10px;
  padding:7px 0;font-size:13.5px;line-height:1.75;color:var(--gray-700);
}
.fp-features li i{
  flex:none;margin-top:6px;width:16px;height:16px;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:9px;border-radius:50%;color:var(--green-600);
  background:var(--green-100);
}

  display:flex;align-items:center;justify-content:center;gap:8px;
  margin-top:20px;padding:9px 12px;border-radius:12px;
  font-size:12.5px;font-weight:700;color:var(--green-800);
  background:linear-gradient(135deg,var(--green-50),#fff);
  border:1px dashed var(--green-300);
}

/* ── کارت ویژه ── */
.fp-card.is-featured{
  background:linear-gradient(165deg,var(--green-800) 0%,var(--green-700) 55%,var(--green-600) 100%);
  border-color:var(--green-600);
  box-shadow:0 24px 55px -20px rgba(6,78,59,.5);
  transform:scale(1.03);z-index:1;
}
@media(max-width:1080px){.fp-card.is-featured{transform:none}}
.fp-card.is-featured:hover{transform:scale(1.03) translateY(-6px)}
.fp-card.is-featured .fp-card-name,
.fp-card.is-featured .fp-price-num{color:#fff}
.fp-card.is-featured .fp-card-tagline,
.fp-card.is-featured .fp-price-meta{color:rgba(255,255,255,.75)}
.fp-card.is-featured .fp-price-unit{color:rgba(255,255,255,.6)}
.fp-card.is-featured .fp-price-monthly{
  color:#fff;background:rgba(255,255,255,.14);
}
.fp-card.is-featured .fp-features li{color:rgba(255,255,255,.92)}
.fp-card.is-featured .fp-features li i{
  color:#fff;background:rgba(255,255,255,.18);
}
.fp-card.is-featured .fp-cta{background:#fff;border-color:#fff;color:var(--green-800)}
.fp-card.is-featured .fp-cta-solid{background:#fff;color:var(--green-800);box-shadow:0 6px 18px rgba(0,0,0,.2)}
.fp-card.is-featured .fp-cta-solid:hover{background:var(--green-50)}
  color:#fff;background:rgba(255,255,255,.1);
  border-color:rgba(255,255,255,.35);
}

  max-width:1200px;margin:36px auto 0;
  background:#fff;border:1px solid var(--gray-200);border-radius:22px;
  padding:26px 28px 22px;
  box-shadow:0 1px 2px rgba(17,24,39,.04);
}
  position:relative;text-align:center;padding:18px 12px 14px;
  border:1px solid var(--gray-200);border-radius:16px;background:var(--gray-50);
  transition:all .25s var(--ease);
}
  position:absolute;top:-10px;right:50%;transform:translateX(50%);
  padding:3px 12px;border-radius:999px;font-size:10.5px;font-weight:700;white-space:nowrap;
  background:linear-gradient(135deg,#f59e0b,#f97316);color:#fff;
}

/* ── جدول مقایسه ──────────────────────────────────────────────── */
.fp-table-wrap{
  max-width:1200px;margin:0 auto;overflow-x:auto;
  background:#fff;border:1px solid var(--gray-200);border-radius:20px;
  box-shadow:0 1px 2px rgba(17,24,39,.04);
}
.fp-table{width:100%;border-collapse:collapse;min-width:680px}
.fp-table thead th{
  position:sticky;top:0;z-index:2;
  padding:16px 14px;background:var(--gray-50);
  font-size:13.5px;font-weight:800;color:var(--gray-800);
  border-bottom:2px solid var(--gray-200);text-align:center;
}
.fp-table thead th.is-featured-col{color:var(--green-700);box-shadow:inset 0 -3px 0 var(--green-500)}
.fp-th-badge{
  display:inline-block;margin-right:6px;padding:2px 8px;border-radius:999px;
  font-size:9.5px;font-weight:700;color:#fff;
  background:linear-gradient(135deg,#f59e0b,#f97316);vertical-align:middle;
}
.fp-col-feature{text-align:right!important;width:34%;min-width:200px;padding-right:22px!important}
.fp-group-row td{
  padding:11px 22px;background:var(--green-50);
  font-size:12.5px;font-weight:800;color:var(--green-800);
  border-bottom:1px solid var(--green-100);
}
.fp-data-row td{
  padding:13px 14px;text-align:center;font-size:13px;color:var(--gray-700);
  border-bottom:1px solid var(--gray-100);
}
.fp-data-row:hover td{background:var(--gray-50)}
.fp-data-row td.fp-col-feature{font-weight:600;color:var(--gray-800)}
.fp-data-row:last-child td{border-bottom:0}

.fp-yes{
  display:inline-flex;align-items:center;justify-content:center;
  width:22px;height:22px;border-radius:50%;font-size:10px;
  color:var(--green-700);background:var(--green-100);
}
.fp-no{
  display:inline-flex;align-items:center;justify-content:center;
  width:22px;height:22px;border-radius:50%;font-size:10px;
  color:var(--gray-400);background:var(--gray-100);
}
.fp-txt{font-weight:700;color:var(--gray-800);font-size:12.5px;white-space:nowrap}
.fp-num{color:var(--green-700);font-size:13.5px;font-weight:800}

/* ── پانویس ───────────────────────────────────────────────────── */
.fp-notes{
  max-width:860px;margin:40px auto 0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
}
@media(max-width:860px){.fp-notes{grid-template-columns:1fr;max-width:480px}}
.fp-note{
  display:flex;align-items:flex-start;gap:10px;
  padding:16px 18px;border-radius:14px;
  background:#fff;border:1px solid var(--gray-200);
  font-size:12px;line-height:1.9;color:var(--gray-600);
}
.fp-note strong{color:var(--gray-900)}
.fp-note i{flex:none;margin-top:4px;color:var(--green-600)}
.fp-link{color:var(--green-700);font-weight:700;text-decoration:underline;text-underline-offset:3px}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce){
}

/* ── Reveal animation (via pricing.js) ── */
.fp-anim{opacity:0;transform:translateY(24px);transition:opacity .6s var(--ease,cubic-bezier(.4,0,.2,1)),transform .6s var(--ease,cubic-bezier(.4,0,.2,1))}
.fp-anim.is-visible{opacity:1;transform:none}
.fp-card.is-featured.fp-anim{transform:scale(1.03) translateY(24px)}
.fp-card.is-featured.fp-anim.is-visible{transform:scale(1.03)}
@media (prefers-reduced-motion: reduce){
  .fp-anim,.fp-card.is-featured.fp-anim{opacity:1;transform:none;transition:none}
  .fp-card.is-featured.fp-anim.is-visible{transform:scale(1.03)}
}

/* ── بک‌گراند تصویری پلن‌ها (هم‌راستا با پنل فانوس) ── */
.fp-card.fp-plan-free-trial,
.fp-card.fp-plan-ashkboos,
.fp-card.fp-plan-kourosh,
.fp-card.fp-plan-dariush{
  background-image:url('/panel/FreeTrial.webp'),linear-gradient(165deg,var(--green-800),var(--green-600));
  background-size:cover;background-position:center;
}
.fp-card.fp-plan-ashkboos{background-image:url('/panel/Ashkbos.webp'),linear-gradient(165deg,var(--green-800),var(--green-600))}
.fp-card.fp-plan-kourosh{background-image:url('/panel/Siros.webp'),linear-gradient(165deg,var(--green-800),var(--green-600))}
.fp-card.fp-plan-dariush{background-image:url('/panel/Daryosh.webp'),linear-gradient(165deg,var(--green-800),var(--green-600))}

/* لایه تیره روی تصویر برای خوانایی (همون الگوی پنل) */
.fp-card.fp-plan-free-trial::before,
.fp-card.fp-plan-ashkboos::before,
.fp-card.fp-plan-kourosh::before,
.fp-card.fp-plan-dariush::before{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(180deg,rgba(0,40,20,.45) 0%,rgba(0,25,12,.7) 100%);
  z-index:0;pointer-events:none;
}
/* محتوا بالای لایه تیره */
.fp-card.fp-plan-free-trial > *:not(.fp-badge),
.fp-card.fp-plan-ashkboos > *:not(.fp-badge),
.fp-card.fp-plan-kourosh > *:not(.fp-badge),
.fp-card.fp-plan-dariush > *:not(.fp-badge){position:relative;z-index:1}

/* متن سفید روی تصویر (همه کارت‌های تصویری) */
.fp-card.fp-plan-free-trial .fp-card-name,
.fp-card.fp-plan-ashkboos .fp-card-name,
.fp-card.fp-plan-kourosh .fp-card-name,
.fp-card.fp-plan-dariush .fp-card-name,
.fp-card.fp-plan-free-trial .fp-price-num,
.fp-card.fp-plan-ashkboos .fp-price-num,
.fp-card.fp-plan-kourosh .fp-price-num,
.fp-card.fp-plan-dariush .fp-price-num{color:#fff}
.fp-card.fp-plan-free-trial .fp-card-tagline,
.fp-card.fp-plan-ashkboos .fp-card-tagline,
.fp-card.fp-plan-kourosh .fp-card-tagline,
.fp-card.fp-plan-dariush .fp-card-tagline,
.fp-card.fp-plan-free-trial .fp-price-meta,
.fp-card.fp-plan-ashkboos .fp-price-meta,
.fp-card.fp-plan-kourosh .fp-price-meta,
.fp-card.fp-plan-dariush .fp-price-meta,
.fp-card.fp-plan-free-trial .fp-price-unit,
.fp-card.fp-plan-ashkboos .fp-price-unit,
.fp-card.fp-plan-kourosh .fp-price-unit,
.fp-card.fp-plan-dariush .fp-price-unit{color:rgba(255,255,255,.78)}
.fp-card.fp-plan-free-trial .fp-features li,
.fp-card.fp-plan-ashkboos .fp-features li,
.fp-card.fp-plan-kourosh .fp-features li,
.fp-card.fp-plan-dariush .fp-features li{color:rgba(255,255,255,.92)}
.fp-card.fp-plan-free-trial .fp-features li i,
.fp-card.fp-plan-ashkboos .fp-features li i,
.fp-card.fp-plan-kourosh .fp-features li i,
.fp-card.fp-plan-dariush .fp-features li i{color:#fff;background:rgba(255,255,255,.18)}
.fp-card.fp-plan-free-trial .fp-price-monthly,
.fp-card.fp-plan-ashkboos .fp-price-monthly,
.fp-card.fp-plan-kourosh .fp-price-monthly,
.fp-card.fp-plan-dariush .fp-price-monthly{color:#fff;background:rgba(255,255,255,.14)}
.fp-card.fp-plan-free-trial .fp-cta,
.fp-card.fp-plan-ashkboos .fp-cta,
.fp-card.fp-plan-kourosh .fp-cta,
.fp-card.fp-plan-dariush .fp-cta{background:#fff;border-color:#fff;color:var(--green-800)}
.fp-card.fp-plan-free-trial .fp-cta:hover,
.fp-card.fp-plan-ashkboos .fp-cta:hover,
.fp-card.fp-plan-kourosh .fp-cta:hover,
.fp-card.fp-plan-dariush .fp-cta:hover{background:var(--green-50)}

/* ── v1.5: بج همیشه کوچک، absolute و وسط‌چین (روی لایه تصویر) ── */
.fp-card .fp-badge{
  position:absolute;top:-13px;right:50%;left:auto;
  transform:translateX(50%);z-index:3;white-space:nowrap;
}

/* ── v1.5: نام و توضیح کوتاه وسط‌چین (در همه کارت‌ها) ── */
.fp-card-name,.fp-card-tagline{text-align:center}

/* ── v1.6: سوییچر پلن‌ها در جدول (فقط موبایل) ── */
.fp-plan-pills{display:none;gap:8px;justify-content:center;flex-wrap:wrap;margin:0 auto 14px;max-width:1200px;padding:0 12px}
.fp-pill{
  appearance:none;cursor:pointer;
  padding:8px 18px;border-radius:999px;
  font-family:inherit;font-size:13px;font-weight:700;
  border:1.5px solid var(--gray-300);background:#fff;color:var(--gray-600);
  transition:all .25s var(--ease,cubic-bezier(.4,0,.2,1));
}
.fp-pill:active{transform:scale(.96)}
.fp-pill.is-active{
  background:var(--green-600);border-color:var(--green-600);color:#fff;
  box-shadow:0 4px 14px rgba(5,150,105,.35);
}
.fp-swipe-hint{
  display:none;text-align:center;font-size:11px;color:var(--gray-400);
  margin:0 auto 12px;padding:0 16px;
}
.fp-swipe-hint i{margin-left:4px}

/* موبایل: جدول single-column با ستون متغیر */
@media(max-width:640px){
  .fp-plan-pills{display:flex}
  .fp-swipe-hint{display:block}
  .fp-table{min-width:0}
  /* همه ستون‌ها مخفی؛ اما ستون توضیحات + ردیف‌های گروه همیشه ثابت و visible */
  .fp-table th,.fp-table td{display:none}
  .fp-table thead th.fp-col-feature,
  .fp-table td.fp-col-feature{display:table-cell}
  .fp-table tr.fp-group-row td{display:table-cell}
  .fp-table[data-active="free-trial"] th[data-col="free-trial"],
  .fp-table[data-active="ashkboos"] th[data-col="ashkboos"],
  .fp-table[data-active="kourosh"]  th[data-col="kourosh"],
  .fp-table[data-active="dariush"]  th[data-col="dariush"],
  .fp-table[data-active="free-trial"] td[data-col="free-trial"],
  .fp-table[data-active="ashkboos"] td[data-col="ashkboos"],
  .fp-table[data-active="kourosh"]  td[data-col="kourosh"],
  .fp-table[data-active="dariush"]  td[data-col="dariush"]{display:table-cell}
  .fp-table th[data-col]{text-align:center;font-size:14px;padding:14px 10px}
  .fp-table th{width:auto}
  .fp-col-feature{width:62%!important;min-width:0!important;text-align:right}
  .fp-table td[data-col]{text-align:center}
  /* انیمیشن تعویض ستون */
  .fp-table.fp-switching td[data-col]{opacity:0;transform:translateX(14px)}
  .fp-table td[data-col]{transition:opacity .22s ease,transform .22s var(--ease,cubic-bezier(.4,0,.2,1))}
  .fp-table-wrap{touch-action:pan-y}
}
