/*
Theme Name: Sava Child
Theme URI: https://sava.af/
Description: قالب فرزند Hello Elementor برای وب‌سایت ساوا — فونت وزیرمتن، راست‌چین، و استایل‌های کمکی دیزاین.
Author: Sava
Template: hello-elementor
Version: 1.0.0
Text Domain: sava-child
*/

/* ------------------------------------------------------------------ *
 * پایه — راست‌چین و فونت
 * ------------------------------------------------------------------ */

.sava-page,
.sava-section {
  direction: rtl;
}

.sava-section {
  font-family: 'Vazirmatn', system-ui, sans-serif;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* متن‌های Elementor حاشیه پاراگراف پیش‌فرض دارند؛ فاصله‌ها با gap کنترل می‌شوند. */
.sava-section .elementor-widget-text-editor p:last-child {
  margin-bottom: 0;
}

/* ------------------------------------------------------------------ *
 * نوبار
 * ------------------------------------------------------------------ */

.sava-nav {
  position: relative;
  z-index: 5;
}

.sava-nav__item {
  cursor: pointer;
  transition: background-color 0.15s ease;
}

.sava-nav__item:not(.sava-nav__item--active):hover {
  background-color: rgba(37, 99, 235, 0.08);
}

.sava-nav__label {
  white-space: nowrap;
}

/* ------------------------------------------------------------------ *
 * دکمه‌ها
 * ------------------------------------------------------------------ */

.sava-btn .elementor-button {
  transition: background-color 0.15s ease, color 0.15s ease;
}

.sava-btn--primary .elementor-button:hover,
.sava-btn--primary .elementor-button:focus {
  background-color: #1d4ed8;
}

.sava-btn--ghost .elementor-button:hover,
.sava-btn--ghost .elementor-button:focus {
  background-color: rgba(37, 99, 235, 0.08);
}

/* ------------------------------------------------------------------ *
 * هیرو — موکاپ داشبورد و دو کالوت کج
 *
 * مختصات از فایل Paper گرفته شده و نسبت به لبهٔ موکاپ (عرض ۱۰۶۳) حساب شده.
 * ------------------------------------------------------------------ */

.sava-hero__mockup {
  position: relative;
  width: 100%;
  max-width: 1063px;
}

.sava-hero__screen img {
  width: 1063px;
  max-width: 100%;
  height: auto;
  display: block;
}

.sava-hero__callout {
  position: absolute;
  width: 252px;
  transform-origin: 0 0;
  z-index: 3;
}

/* «امکان صدور فاکتور» — سمت چپ موکاپ */
.sava-hero__callout--invoice {
  top: 209px;
  left: -154px;
  transform: rotate(5.06deg);
}

/* «امکان خروجی گرفتن ساده» — سمت راست موکاپ */
.sava-hero__callout--export {
  top: 61px;
  right: -165px;
  transform: rotate(-5.55deg);
}

.sava-hero__lead {
  max-width: 640px;
}

/* ------------------------------------------------------------------ *
 * ریسپانسیو
 * ------------------------------------------------------------------ */

@media (max-width: 1600px) {
  /* کالوت‌ها بیرون از موکاپ می‌زنند؛ در عرض کمتر می‌آیند داخل. */
  .sava-hero__callout--invoice {
    left: -40px;
  }
  .sava-hero__callout--export {
    right: -40px;
  }
}

@media (max-width: 1024px) {
  .sava-hero__callout {
    width: 220px;
  }
  .sava-hero__callout--invoice {
    top: 24%;
    left: -12px;
  }
  .sava-hero__callout--export {
    top: 6%;
    right: -12px;
  }
  .sava-nav__wordmark {
    display: none;
  }
}

@media (max-width: 767px) {
  /* روی موبایل کالوت‌ها روی موکاپ می‌افتند و ناخوانا می‌شوند. */
  .sava-hero__callout {
    display: none;
  }
  .sava-hero__screen img {
    border-width: 2px;
    border-radius: 16px;
  }
}