/*!
 * ابزارهای فروش کارینا بتن ایرانیان — سیستم طراحی مشترک
 * © ۱۴۰۴ کارینا بتن ایرانیان. تمامی حقوق محفوظ است.
 * Copyright (c) Karina Beton Iranians — All Rights Reserved.
 * کپی یا استفادهٔ غیرمجاز از این ابزارها ممنوع و دارای پیگرد قانونی است.
 * ==========================================================================
 *  سیستم طراحی مشترک ابزارهای فروش — همه‌چیز زیر .ktool اسکوپ شده.
 * ========================================================================== */

/* فونت لوکال (هماهنگ با هاست ایران — بدون CDN خارجی) */
@font-face { font-family:"Vazirmatn"; src:url("/assets/fonts/Vazirmatn-Regular.woff2") format("woff2"); font-weight:400; font-display:swap; }
@font-face { font-family:"Vazirmatn"; src:url("/assets/fonts/Vazirmatn-SemiBold.woff2") format("woff2"); font-weight:600; font-display:swap; }
@font-face { font-family:"Vazirmatn"; src:url("/assets/fonts/Vazirmatn-Bold.woff2") format("woff2"); font-weight:700; font-display:swap; }
@font-face { font-family:"Vazirmatn"; src:url("/assets/fonts/Vazirmatn-ExtraBold.woff2") format("woff2"); font-weight:800; font-display:swap; }

.ktool {
  /* پالت برند */
  --cream:#FBF4EC; --cream-deep:#F2E8DA; --charcoal:#2B231C; --clay:#C8703D; --clay-deep:#A85A2E; --clay-light:#E0995F;
  --charcoal-60:rgba(43,35,28,.6); --charcoal-40:rgba(43,35,28,.4); --charcoal-12:rgba(43,35,28,.12);
  --clay-soft:rgba(200,112,61,.12); --success:#5C7A4A; --line:#E7D9C6;
  --shadow-sm:0 2px 8px rgba(43,35,28,.05);
  --shadow:0 6px 26px rgba(43,35,28,.09); --shadow-lg:0 18px 56px rgba(43,35,28,.16);
  --ease:cubic-bezier(.22,1,.36,1);
  --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s5:40px;
  --r-card:18px; --r-btn:12px; --r-pill:999px;

  direction:rtl; text-align:right;
  font-family:"Vazirmatn",Tahoma,"Segoe UI",sans-serif;
  color:var(--charcoal);
  /* بافت مهندسی ظریف (حس نقشه‌کشی/graph paper) */
  background-color:var(--cream);
  background-image:radial-gradient(circle at 1px 1px, rgba(43,35,28,.045) 1px, transparent 0);
  background-size:24px 24px;
  font-size:16px; line-height:1.8; -webkit-font-smoothing:antialiased;
  box-sizing:border-box;
}
.ktool *, .ktool *::before, .ktool *::after { box-sizing:border-box; }
.ktool img { max-width:100%; display:block; }
.ktool button { font-family:inherit; cursor:pointer; }
.ktool h1,.ktool h2,.ktool h3,.ktool h4 { margin:0; line-height:1.35; font-weight:800; text-wrap:balance; }
.ktool p { margin:0; }

/* ---------- چیدمان ---------- */
.ktool-wrap { max-width:780px; margin-inline:auto; padding:var(--s4) var(--s2) var(--s3); }
.ktool-head { text-align:center; margin-bottom:var(--s4); }
.ktool-head .ktool-eyebrow { display:inline-flex; align-items:center; gap:7px; background:#fff; border:1px solid var(--line); color:var(--clay-deep);
  font-size:13px; font-weight:800; padding:7px 16px; border-radius:var(--r-pill); margin-bottom:var(--s2); box-shadow:var(--shadow-sm); }
.ktool-head .ktool-eyebrow svg { color:var(--clay); }
.ktool-head h1 { font-size:clamp(24px,5vw,34px); letter-spacing:-.5px; margin-bottom:10px; }
.ktool-head p { color:var(--charcoal-60); font-size:clamp(14px,2.5vw,16px); max-width:520px; margin-inline:auto; }

/* انیمیشن ورود نرم */
@keyframes ktReveal { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:none; } }

/* ---------- کارت ---------- */
.ktool-card { background:#fff; border:1px solid var(--line); border-radius:var(--r-card); box-shadow:var(--shadow); padding:var(--s3);
  margin-bottom:var(--s3); animation:ktReveal .5s var(--ease) both; }
.ktool-card--flat { box-shadow:none; }

/* ---------- فیلدها ---------- */
.ktool-field { margin-bottom:var(--s3); }
.ktool-field:last-child { margin-bottom:0; }
.ktool-label { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:14.5px; font-weight:700; margin-bottom:10px; }
.ktool-label .ktool-val { color:var(--clay-deep); font-weight:800; font-size:17px; background:var(--clay-soft); padding:2px 12px; border-radius:var(--r-pill); }
.ktool-input { width:100%; font-family:inherit; font-size:17px; font-weight:700; color:var(--charcoal);
  padding:14px 16px; border:1.5px solid var(--line); border-radius:var(--r-btn); background:#fff;
  transition:border-color .2s ease, box-shadow .2s ease; text-align:right; }
.ktool-input:focus { outline:none; border-color:var(--clay); box-shadow:0 0 0 4px var(--clay-soft); }
.ktool-input--num { direction:ltr; text-align:center; letter-spacing:.5px; }

/* اسلایدر (تاکتیل‌تر) */
.ktool-range { -webkit-appearance:none; appearance:none; width:100%; height:9px; border-radius:var(--r-pill); cursor:pointer;
  background:linear-gradient(90deg,var(--clay-light) 0%,var(--clay) var(--fill,40%),var(--cream-deep) var(--fill,40%)); margin-top:var(--s2); }
.ktool-range::-webkit-slider-thumb { -webkit-appearance:none; width:30px; height:30px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #e7a877, var(--clay) 60%); border:4px solid #fff;
  box-shadow:0 4px 12px rgba(200,112,61,.4); cursor:grab; transition:transform .15s ease, box-shadow .15s ease; }
.ktool-range::-webkit-slider-thumb:hover { transform:scale(1.08); }
.ktool-range::-webkit-slider-thumb:active { transform:scale(1.16); cursor:grabbing; box-shadow:0 6px 18px rgba(200,112,61,.5); }
.ktool-range::-moz-range-thumb { width:24px; height:24px; border-radius:50%; background:var(--clay); border:4px solid #fff; box-shadow:0 4px 12px rgba(200,112,61,.4); cursor:pointer; }

/* انتخاب چندگزینه‌ای (segmented) */
.ktool-seg { display:flex; gap:8px; flex-wrap:wrap; }
.ktool-seg__btn { flex:1 1 auto; min-width:64px; text-align:center; padding:13px 10px; border:1.5px solid var(--line); border-radius:var(--r-btn);
  background:#fff; font-size:15px; font-weight:700; color:var(--charcoal-60); transition:all .18s var(--ease); }
.ktool-seg__btn:hover { border-color:var(--clay); color:var(--clay); transform:translateY(-1px); }
.ktool-seg__btn.is-active { background:linear-gradient(135deg,var(--clay),var(--clay-deep)); border-color:transparent; color:#fff; box-shadow:0 6px 16px rgba(200,112,61,.32); transform:translateY(-1px); }

/* ---------- دکمه‌ها ---------- */
.ktool-btn { position:relative; display:inline-flex; align-items:center; justify-content:center; gap:9px; font-family:inherit; font-size:16px; font-weight:800;
  padding:16px 28px; border:none; border-radius:var(--r-btn); overflow:hidden; transition:transform .2s var(--ease), box-shadow .2s ease, background .2s ease; }
.ktool-btn svg { width:20px; height:20px; }
.ktool-btn--primary { background:linear-gradient(135deg,var(--clay-light),var(--clay) 55%,var(--clay-deep)); color:#fff; box-shadow:0 8px 22px rgba(200,112,61,.32); }
.ktool-btn--primary::after { content:""; position:absolute; inset:0; background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.28) 50%,transparent 70%);
  transform:translateX(120%); transition:transform .6s ease; }
.ktool-btn--primary:hover { transform:translateY(-2px); box-shadow:0 14px 32px rgba(200,112,61,.42); }
.ktool-btn--primary:hover::after { transform:translateX(-120%); }
.ktool-btn--primary:active { transform:translateY(0); }
.ktool-btn--ghost { background:#fff; color:var(--charcoal); border:1.5px solid var(--line); }
.ktool-btn--ghost:hover { border-color:var(--clay); color:var(--clay); transform:translateY(-1px); }
.ktool-btn--block { width:100%; }
.ktool-btn--lg { padding:18px 32px; font-size:17px; }
.ktool-btn[disabled] { opacity:.55; cursor:not-allowed; transform:none; box-shadow:none; }
.ktool-btn[disabled]::after { display:none; }

/* ---------- کارت نتیجه (دراماتیک) ---------- */
.ktool-result { position:relative; overflow:hidden; background:linear-gradient(150deg,#33291f,var(--charcoal) 60%,#1f1812); color:var(--cream); border-radius:var(--r-card);
  padding:var(--s5) var(--s3); text-align:center; box-shadow:var(--shadow-lg); animation:ktReveal .6s var(--ease) both; }
.ktool-result::before { content:""; position:absolute; inset:0 0 auto 0; height:5px; background:linear-gradient(90deg,var(--clay),#e0995f,var(--clay-deep)); z-index:2; }
/* هالهٔ نور + موتیف نقشه‌کشی */
.ktool-result::after { content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(420px 240px at 50% 0%, rgba(200,112,61,.28), transparent 70%),
    repeating-linear-gradient(0deg, rgba(251,244,236,.035) 0 1px, transparent 1px 30px),
    repeating-linear-gradient(90deg, rgba(251,244,236,.035) 0 1px, transparent 1px 30px); }
.ktool-result > * { position:relative; z-index:1; }
.ktool-result__label { font-size:15px; color:rgba(251,244,236,.72); font-weight:600; }
.ktool-result__big { font-size:clamp(38px,9vw,54px); font-weight:800; line-height:1.05; color:#fff; letter-spacing:-1.5px; margin:10px 0;
  text-shadow:0 2px 30px rgba(200,112,61,.35); }
.ktool-result__big .unit { font-size:.45em; font-weight:700; color:var(--clay-light); margin-inline-start:8px; letter-spacing:0; }
.ktool-result__sub { font-size:15px; color:rgba(251,244,236,.78); }

/* میله‌های مقایسه */
.ktool-compare { display:grid; gap:var(--s2); margin-top:var(--s4); }
.ktool-compare__row { text-align:right; }
.ktool-compare__head { display:flex; justify-content:space-between; font-size:13.5px; font-weight:700; margin-bottom:7px; color:rgba(251,244,236,.85); }
.ktool-compare__track { height:38px; background:rgba(251,244,236,.10); border-radius:10px; overflow:hidden; position:relative; }
.ktool-compare__fill { height:100%; border-radius:10px; display:flex; align-items:center; padding-inline-start:14px; color:#fff; font-weight:800; font-size:14px;
  width:0; transition:width 1.1s var(--ease); white-space:nowrap; box-shadow:inset 0 -2px 0 rgba(0,0,0,.12); }
.ktool-compare__fill--precast { background:linear-gradient(90deg,var(--success),#7a9b62); }
.ktool-compare__fill--trad { background:linear-gradient(90deg,#8a7d6e,#a89987); }

/* ---------- فرم سرنخ (CTA) ---------- */
.ktool-cta { text-align:center; margin-top:var(--s3); }
.ktool-cta__title { font-size:19px; font-weight:800; margin-bottom:7px; }
.ktool-cta__sub { color:var(--charcoal-60); font-size:14.5px; margin-bottom:var(--s3); }
.ktool-lead { display:grid; gap:var(--s2); max-width:430px; margin-inline:auto; text-align:right; }
.ktool-lead .ktool-input--err { border-color:#d0492f; box-shadow:0 0 0 4px rgba(208,73,47,.1); }
.ktool-lead__err { color:#d0492f; font-size:13px; font-weight:700; min-height:0; }
.ktool-success { background:linear-gradient(135deg,#eef3e9,var(--clay-soft)); border:1px solid var(--line); border-radius:var(--r-card); padding:var(--s4) var(--s3); text-align:center; animation:ktReveal .5s var(--ease) both; }
.ktool-success__check { width:60px; height:60px; border-radius:50%; background:var(--success); color:#fff; display:grid; place-items:center; margin:0 auto var(--s2); box-shadow:0 8px 20px rgba(92,122,74,.4); animation:ktPop .5s var(--ease) both; }
.ktool-success__check svg { width:30px; height:30px; }
.ktool-success h3 { font-size:19px; margin-bottom:6px; }
.ktool-success p { color:var(--charcoal-60); font-size:14.5px; }
@keyframes ktPop { 0%{transform:scale(0);} 60%{transform:scale(1.15);} 100%{transform:scale(1);} }

/* ---------- وضعیت خالی / محاسبه ---------- */
.ktool-hint { text-align:center; color:var(--charcoal-40); font-size:14px; padding:var(--s3) var(--s2); }
.ktool-hint::before { content:"↑"; display:block; font-size:22px; color:var(--clay); margin-bottom:6px; opacity:.6; animation:ktBob 2s ease-in-out infinite; }
@keyframes ktBob { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-5px);} }

/* ---------- توست ---------- */
.ktool-toast { position:fixed; inset-block-end:24px; inset-inline:0; margin-inline:auto; width:max-content; max-width:90%;
  background:var(--charcoal); color:var(--cream); padding:13px 22px; border-radius:var(--r-pill); font-weight:700; font-size:14px;
  box-shadow:var(--shadow-lg); opacity:0; transform:translateY(16px); transition:opacity .3s ease, transform .3s ease; z-index:9999; pointer-events:none; }
.ktool-toast.is-show { opacity:1; transform:none; }

/* ---------- ریسپانسیو ---------- */
@media (max-width:480px) {
  .ktool-wrap { padding:var(--s3) var(--s2) var(--s2); }
  .ktool-card { padding:var(--s2) var(--s2); border-radius:14px; }
  .ktool-result { padding:var(--s4) var(--s2); }
}

/* امضای طراح */
.ktool-credit { text-align:center; padding:16px 16px 8px; }
.ktool-credit::before { content:""; display:block; width:90px; height:1px; margin:0 auto 11px; background:linear-gradient(90deg,transparent,rgba(200,112,61,.4),transparent); }
.ktool-credit__inner { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:600; color:var(--charcoal-40); }
.ktool-credit__name { font-weight:800; font-size:12px; background-image:linear-gradient(100deg,#C8703D,#E6B17A,#F4DEB3,#E6B17A,#C8703D); background-size:220% auto; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; animation:creditShine 5.5s linear infinite; }
.ktool-credit__spark { display:none; }
@keyframes creditShine { to { background-position:-220% center; } }
@keyframes creditPulse { 0%,100%{opacity:.45;transform:scale(.85);} 50%{opacity:1;transform:scale(1.2);} }

@media (prefers-reduced-motion:reduce) {
  .ktool *, .ktool *::before, .ktool *::after { transition:none !important; animation:none !important; }
}