/* ==========================================================================
   گیلند ملک (سایت ۲) — نوار ثابت پایین صفحه (فقط موبایل)

   یک نوار برای همه ی صفحه ها. تا پیش از این دو نوارِ جدا وجود داشت که هیچ کدام
   سراسری نبود:
     • ‎.mobile-action-bar‎ فقط داخل ‎intro/index.blade.php‎ (صفحه ی اول) با سه
       گزینه ، بدون هیچ راهی به اجاره ی کوتاه مدت.
     • ‎.rt-dock‎ فقط داخل ‎layouts/footer_rent‎ (صفحه های ‎/rental‎).
   یعنی روی گوشی ، کاربری که در صفحه ی یک ملک یا نتایج جستجو بود هیچ نوار ثابتی
   نمی دید و «اجاره کوتاه مدت» فقط از منوی همبرگری پیدا می شد. حالا این پارشیال
   از ‎layouts/dock.blade.php‎ و از دلِ ‎intro/appnew_v2‎ روی همه ی صفحه ها رندر
   می شود و فهرست گزینه هایش را از مسیر جاری می گیرد.

   این فایل بی قید و شرط بارگذاری می شود (بر خلاف ‎site2/rental.css‎ که فقط روی
   مسیرهای اجاره می آید) ، پس توکن هایش را خودش تعریف می کند و به ‎.rt-page‎
   تکیه نمی کند.
   ========================================================================== */

.gd-dock,
.gd-sheet {
  /* پالت اصلی سایت — همان مقادیر ‎intro/index.blade.php‎ */
  --gd-green: #124734;
  --gd-green-soft: #E7F0EB;
  --gd-muted: #53645D;        /* ۶٫۱ روی سفید */
  --gd-line: #DFE8E3;
  /* پالت بخش اجاره — همان مقادیر ‎site2/rental.css‎ ؛ فقط رنگ هایی که متن
     رویشان می نشیند (نه ‎#0DA9A5‎ که با سفید ۲٫۹ است) */
  --gd-teal: #097875;
  --gd-teal-soft: #E6F7F6;

  --gd-accent: var(--gd-green);
  --gd-accent-soft: var(--gd-green-soft);
}

.gd-dock {
  /* بیرون از ‎<main>‎ رندر می شود و ‎appnew_v2‎ فقط به ‎main , footer‎ جهت
     راست به چپ می دهد ، پس بدون این خط ترتیب تب ها آینه ای می شد. */
  direction: rtl;

  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1035;
  /* پیش فرض پنهان ؛ فقط داخل بلوکِ موبایلِ پایین همین فایل روشن می شود. یک
     ‎display:none‎ در مدیا کوئریِ ‎min-width‎ بعد از بلوک موبایل ، اختصاصیتِ
     برابر دارد و همه جا برنده می شد. */
  display: none;
  gap: 2px;
  padding: 6px max(6px, env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(6px, env(safe-area-inset-left));
  border-top: 1px solid var(--gd-line);
  background: rgba(255, 255, 255, .97);
  backdrop-filter: blur(12px);
  box-shadow: 0 -6px 24px rgba(16, 42, 67, .1);
  font-family: inherit;
}

/* داخل بخش اجاره ، همان فیروزه ای پوسته ی اجاره */
.gd-dock--rental,
.gd-sheet.gd-dock--rental {
  --gd-accent: var(--gd-teal);
  --gd-accent-soft: var(--gd-teal-soft);
}

.gd-dock__item {
  position: relative;
  display: flex;
  flex: 1 1 0;
  min-width: 0;
  min-height: 48px;          /* هدفِ لمسیِ استاندارد */
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 6px 2px 4px;
  color: var(--gd-muted) !important;
  font-size: .66rem;
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
  text-decoration: none !important;
  /* «ثبت آگهی» یک ‎<button>‎ است (برگه ی انتخاب باز می کند) و باید عینِ لینک ها
     دیده شود */
  border: 0;
  background: none;
  cursor: pointer;
  font-family: inherit;
}

.gd-dock__item i {
  display: block;
  font-size: 1.15rem;
  line-height: 1;
}

/* برچسب ها تا دو خط می شکنند و بعد «…» می خورند. پیش از این ‎nowrap‎ بودند و
   یک خطی می ماندند ، که تا وقتی همه ی برچسب ها کوتاه بودند مشکلی نداشت ؛ اما
   فهرست های نقش محور برچسب های بلندتری دارند («اقامتگاه‌های من» ، «مدیریت
   رزروها») و روی گوشی ۳۶۰ پیکسلی به «اقامتگاه‌ها…» می رسیدند. */
.gd-dock__label {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  max-width: 100%;
  overflow: hidden;
  white-space: normal;
  /* شکستن فقط سرِ فاصله. با ‎anywhere‎ کروم وسط «اقامتگاه‌های» ( سرِ نیم فاصله )
     می شکست و «اقامتگاه‌ها / ی من» می شد. */
  overflow-wrap: normal;
  word-break: normal;
}

/* تبِ صفحه ی جاری: رنگ + یک نشانگر باریک بالای تب */
.gd-dock__item.is-active {
  color: var(--gd-accent) !important;
}

.gd-dock__item.is-active::before {
  content: '';
  position: absolute;
  top: 0;
  inset-inline: 22%;
  height: 3px;
  border-radius: 0 0 3px 3px;
  background: var(--gd-accent);
}

/* گزینه ی برجسته (اجاره کوتاه مدت روی سایت اصلی ، ثبت اقامتگاه داخل بخش اجاره).
   فقط پشتِ آیکن رنگ می گیرد و نه کلِ کاشی: یک کاشیِ پُررنگ میان چهار تبِ خنثی
   به «کنشِ اصلی» خوانده نمی شود ، به یک اشتباه خوانده می شود. */
.gd-dock__item--accent {
  /* برچسبش («اجاره کوتاه‌مدت» / «ثبت اقامتگاه») از بقیه بلندتر است و با سهم
     مساوی روی گوشی ۳۶۰ پیکسلی به «اجاره کوتاه…» می رسید */
  flex-grow: 1.3;
  color: var(--gd-accent) !important;
}

.gd-dock__item--accent i {
  padding: 5px 12px;
  border-radius: 999px;
  background: var(--gd-accent-soft);
  color: var(--gd-accent);
}

.gd-dock__item--accent.is-active i {
  background: var(--gd-accent);
  color: #fff;
}

/* فهرستِ شش گزینه ای (مدیر ، بیرون از بخش اجاره). با سهمِ برابر هر کاشی روی
   گوشی ۳۶۰ پیکسلی به ۵۸ پیکسل می رسد ، پس متن و فاصله ها یک درجه جمع تر
   می شوند و گزینه ی برجسته سهمِ اضافه اش را پس می دهد. */
.gd-dock--six .gd-dock__item {
  padding-inline: 0;
  font-size: .6rem;
}

.gd-dock--six .gd-dock__item i {
  font-size: 1.05rem;
}

.gd-dock--six .gd-dock__item--accent {
  flex-grow: 1;
}

.gd-dock--six .gd-dock__item--accent i {
  padding-inline: 8px;
}

/* --------------------------------------------------------------------------
   برگه ی انتخابِ «ثبت ملک / ثبت اقامتگاه» (‎layouts/dock.blade.php‎)
   از کاشیِ «ثبت آگهی» باز می شود و از پایین بالا می آید. مثل خودِ نوار بیرون از
   ‎<main>‎ رندر می شود ، پس جهت را خودش می دهد.
   -------------------------------------------------------------------------- */

.gd-sheet {
  position: fixed;
  inset: 0;
  z-index: 1040;             /* روی نوار (۱۰۳۵) */
  direction: rtl;
  text-align: right;
}

.gd-sheet[hidden] {
  display: none;
}

.gd-sheet__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(16, 42, 67, .45);
}

.gd-sheet__panel {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 8px 16px calc(16px + env(safe-area-inset-bottom));
  border-radius: 20px 20px 0 0;
  background: #fff;
  box-shadow: 0 -10px 40px rgba(16, 42, 67, .2);
  animation: gd-sheet-up .22s ease-out;
}

@keyframes gd-sheet-up {
  from { transform: translateY(24px); opacity: 0; }
  to   { transform: none; opacity: 1; }
}

.gd-sheet__grip {
  display: block;
  width: 40px;
  height: 4px;
  margin: 0 auto 10px;
  border-radius: 2px;
  background: var(--gd-line);
}

.gd-sheet__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

/* پوسته روی ‎h1..h6‎ رنگ و اندازه ی خودش را می گذارد ، پس هر دو اینجا صریح اند */
.gd-sheet__title {
  margin: 0;
  color: #102A43;
  font-size: 1rem;
  font-weight: 800;
}

.gd-sheet__close {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: #F1F5F3;
  color: var(--gd-muted);
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
}

.gd-sheet__option {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 64px;
  margin-top: 8px;
  padding: 10px 14px;
  border: 1px solid var(--gd-line);
  border-radius: 14px;
  color: #102A43 !important;
  text-decoration: none !important;
}

.gd-sheet__option:active,
.gd-sheet__option:focus-visible {
  border-color: var(--gd-accent);
  background: var(--gd-accent-soft);
  outline: none;
}

.gd-sheet__option > i:first-child {
  flex: 0 0 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: var(--gd-accent-soft);
  color: var(--gd-accent);
  font-size: 1.3rem;
}

.gd-sheet__text {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.gd-sheet__text strong {
  font-size: .95rem;
  font-weight: 800;
}

.gd-sheet__text small {
  color: var(--gd-muted);
  font-size: .75rem;
}

/* آیکن های شورونِ این پوسته وارونه اند (‎fi-chevron-right‎ فلشِ چپ می کشد) ،
   که در راست به چپ همان «به سمت مقصد» است */
.gd-sheet__arrow {
  color: var(--gd-muted);
  font-size: .8rem;
}
/* --------------------------------------------------------------------------
   فقط موبایل
   -------------------------------------------------------------------------- */

@media (max-width: 767.98px) {
  .gd-dock {
    display: flex;
  }

  /* نوار نباید روی آخرین ردیف فوتر بیفتد. صفحه هایی که خودشان
     ‎padding-bottom‎ بزرگ تری دارند (فوتر سایت اصلی ‎92px‎ می گذارد) دست نخورده
     می مانند چون این مقدار کمتر است و همان جا بازنویسی می شود.
     برچسبِ دو خطی نوار را تا حدود ۶۹ پیکسل بلند می کند ( گزینه ی برجسته
     آیکنِ بلندتری هم دارد ) ، پس این مقدار از ۶۴ به ۷۶ رفت. */
  body.has-gd-dock {
    padding-bottom: 76px;
  }

  /* دکمه ی «بالای صفحه» و ویجت گفتینو هر دو گوشه ی پایین می نشینند و بدون این
     دو خط زیرِ نوار گم می شدند. */
  body.has-gd-dock .btn-scroll-top {
    bottom: 88px;
  }

  body.has-gd-dock #goftino_w,
  body.has-gd-dock [id^="goftino"] {
    bottom: 80px !important;
  }

  body.gd-sheet-open {
    overflow: hidden;
  }
}

/* گوشی های باریک (۳۶۰ و ۳۲۰ پیکسل) — برچسب ها نباید به «…» برسند */
@media (max-width: 400px) {
  .gd-dock__item {
    font-size: .6rem;
  }

  .gd-dock__item i {
    font-size: 1.05rem;
  }
}
