/* ==========================================================================
   لایه‌ی پرداخت ظاهری سایت — refine.css
   ==========================================================================
   این فایل **بعد از** CSS قالب بارگذاری می‌شود و فقط ظاهر را جلا می‌دهد:
   گردی گوشه‌ها، سایه، رنگ، حالت hover و focus، و نرمی حرکت.

   ⚠️ قاعده‌ی این فایل: هیچ چیز چیدمانی عوض نمی‌شود.
   یعنی display، position، float، width، height، grid و flex اینجا دست
   نمی‌خورند. اگر روزی خواستی چیدمان را عوض کنی، جای دیگری بنویس — وگرنه
   دلیل جابه‌جا شدن یک ستون هیچ‌وقت پیدا نمی‌شود.
   ========================================================================== */

:root {
    /* از همان پالت قالب ساخته شده، فقط دقیق‌تر */
    --rf-ink: #1f2233;
    --rf-ink-2: #4b5266;
    --rf-ink-3: #8d99af;
    --rf-line: #e4e8f0;
    --rf-line-2: #eef1f6;
    --rf-navy: #2b2d42;
    --rf-navy-600: #383b57;
    --rf-accent: #2563eb;
    --rf-accent-soft: rgba(37, 99, 235, .08);
    --rf-good: #16a34a;
    --rf-bad: #dc2626;

    --rf-r-sm: 8px;
    --rf-r: 12px;
    --rf-r-lg: 16px;

    --rf-shadow-1: 0 1px 2px rgba(21, 25, 40, .04), 0 2px 8px -2px rgba(21, 25, 40, .06);
    --rf-shadow-2: 0 2px 4px rgba(21, 25, 40, .05), 0 10px 24px -8px rgba(21, 25, 40, .13);
    --rf-shadow-3: 0 4px 8px rgba(21, 25, 40, .06), 0 22px 46px -16px rgba(21, 25, 40, .22);

    --rf-ease: cubic-bezier(.4, 0, .2, 1);
}

/* ---------- پایه ---------- */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* اسکرول‌بار نازک و بی‌سروصدا */
* { scrollbar-width: thin; scrollbar-color: #c9d1e0 transparent; }
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: #c9d1e0; border-radius: 99px; border: 2px solid transparent; background-clip: content-box; }
*::-webkit-scrollbar-thumb:hover { background: #aab5c8; background-clip: content-box; }

/* حلقه‌ی فوکوس یکدست — برای کیبورد، نه برای موس */
:focus-visible {
    outline: 2px solid var(--rf-accent) !important;
    outline-offset: 2px !important;
    border-radius: 6px;
}

/* ---------- دکمه‌ها ---------- */
/* دکمه‌ی اصلی قالب: گوشه‌ی ۲ پیکسلی و outline خط‌چین قدیمی بود */
.theme_btn_2,
.theme_btn {
    border-radius: var(--rf-r-sm) !important;
    outline: none !important;
    outline-offset: 0 !important;
    box-shadow: 0 1px 2px rgba(21, 25, 40, .12), 0 4px 12px -4px rgba(43, 45, 66, .5) !important;
    font-weight: 600;
    letter-spacing: -.2px;
    transition: transform .14s var(--rf-ease),
                box-shadow .18s var(--rf-ease),
                background-color .18s var(--rf-ease),
                filter .18s var(--rf-ease) !important;
}
.theme_btn_2:hover,
.theme_btn:hover {
    filter: brightness(1.12);
    box-shadow: 0 2px 4px rgba(21, 25, 40, .14), 0 10px 22px -6px rgba(43, 45, 66, .55) !important;
    transform: translateY(-1px);
}
.theme_btn_2:active,
.theme_btn:active { transform: translateY(0); filter: brightness(.97); }
.theme_btn_2:disabled,
.theme_btn:disabled { opacity: .55; transform: none; filter: none; cursor: not-allowed; }

/* دکمه‌های بوت‌استرپی */
.btn {
    border-radius: var(--rf-r-sm);
    font-weight: 600;
    transition: transform .14s var(--rf-ease), box-shadow .18s var(--rf-ease), filter .18s var(--rf-ease);
}
.btn:hover { transform: translateY(-1px); filter: brightness(1.06); }
.btn:active { transform: translateY(0); }
.btn-primary { background-color: var(--rf-accent); border-color: var(--rf-accent); }
.btn-danger { background-color: var(--rf-bad); border-color: var(--rf-bad); }
.btn-close { border-radius: 50%; transition: background-color .16s var(--rf-ease), transform .16s var(--rf-ease); }
.btn-close:hover { background-color: rgba(0, 0, 0, .07); transform: rotate(90deg); }

/* ---------- کارت‌ها و جعبه‌ها ---------- */
.card {
    border: 1px solid var(--rf-line);
    border-radius: var(--rf-r-lg);
    box-shadow: var(--rf-shadow-1);
    overflow: hidden;
    transition: box-shadow .22s var(--rf-ease), transform .22s var(--rf-ease), border-color .22s var(--rf-ease);
}
.card:hover {
    box-shadow: var(--rf-shadow-2);
    transform: translateY(-2px);
    border-color: #d7deeb;
}
.card-img-top { border-radius: 0; }

.box_lands_form {
    border: 1px solid var(--rf-line);
    border-radius: var(--rf-r-lg) !important;
    box-shadow: var(--rf-shadow-1) !important;
    background: #fff;
}
.box_lands_form_title {
    border-radius: var(--rf-r) !important;
    letter-spacing: -.3px;
    box-shadow: 0 6px 18px -10px rgba(43, 45, 66, .8);
}

.box_detail_property .row {
    border-radius: var(--rf-r) !important;
    background-color: rgba(82, 82, 82, .10) !important;
    border: 1px solid rgba(255, 255, 255, .06);
    transition: background-color .18s var(--rf-ease);
}
.box_detail_property .row:hover { background-color: rgba(82, 82, 82, .16) !important; }

.listing-item,
.offer-card { border-radius: var(--rf-r-lg); overflow: hidden; }

/* ---------- ورودی‌ها ---------- */
.form-control,
.form-select,
input[type="text"],
input[type="tel"],
input[type="number"],
input[type="search"],
textarea,
select {
    border-radius: var(--rf-r-sm);
    border-color: var(--rf-line);
    transition: border-color .16s var(--rf-ease), box-shadow .16s var(--rf-ease), background-color .16s var(--rf-ease);
}
.form-control:focus,
.form-select:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
textarea:focus,
select:focus {
    border-color: rgba(37, 99, 235, .45);
    box-shadow: 0 0 0 3px var(--rf-accent-soft);
    outline: none;
}
::placeholder { color: var(--rf-ink-3); opacity: .85; }

/* گروه رادیویی فیلترها */
.radio-btn-groups-label {
    border-radius: var(--rf-r-sm) !important;
    transition: background-color .16s var(--rf-ease), color .16s var(--rf-ease), box-shadow .16s var(--rf-ease);
}
.radio-btn-groups-label:hover { box-shadow: var(--rf-shadow-1); }

/* ---------- نشان‌ها ---------- */
.badge {
    border-radius: 99px;
    font-weight: 600;
    letter-spacing: -.1px;
    padding-inline: .7em;
}

/* ---------- تصاویر ---------- */
/* زمینه‌ی ملایم تا تا وقتی عکس نیامده، جای خالیِ سفید و پرشی نبینیم */
img { background-color: var(--rf-line-2); }
img[src] { animation: rf-fade .35s var(--rf-ease) both; }
@keyframes rf-fade { from { opacity: 0; } to { opacity: 1; } }
/* آواتار و آیکون‌ها زمینه نگیرند */
img[src*="icon"], img[src*="logo"], .navbar img, svg image { background-color: transparent; }

/* ---------- جدول‌ها ---------- */
.table { border-radius: var(--rf-r); overflow: hidden; }
.table tbody tr { transition: background-color .14s var(--rf-ease); }

/* ---------- مودال ---------- */
.modal-content { border: 0; border-radius: var(--rf-r-lg); box-shadow: var(--rf-shadow-3); }
.modal-header, .modal-footer { border-color: var(--rf-line); }

/* ---------- پیوندها ---------- */
a { transition: color .15s var(--rf-ease), opacity .15s var(--rf-ease); }

/* ---------- انتقال نرم بین صفحه‌ها ---------- */
/* با React Router + viewTransition، عوض شدن صفحه محو می‌شود به‌جای پرش */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: rf-out .16s var(--rf-ease) both; }
::view-transition-new(root) { animation: rf-in .22s var(--rf-ease) both; }
@keyframes rf-out { to { opacity: 0; } }
@keyframes rf-in { from { opacity: 0; } to { opacity: 1; } }

/* اسکلت بارگذاری مشترک */
.rf-skeleton {
    background: linear-gradient(100deg, var(--rf-line-2) 30%, #f7f9fc 50%, var(--rf-line-2) 70%);
    background-size: 200% 100%;
    animation: rf-shimmer 1.25s linear infinite;
    border-radius: var(--rf-r-sm);
}
@keyframes rf-shimmer { to { background-position: -200% 0; } }

/* ---------- احترام به تنظیم کاربر ---------- */
@media (prefers-reduced-motion: reduce) {
    /* ⚠️ نوارهای پیشرفت استثنا هستند: حرکتشان تزئینی نیست، «وضعیت» را
       نشان می‌دهد. قانون قبلی همه را با !important صفر می‌کرد و نوار زمان
       استوری روی هر دستگاهی که «کاهش حرکت» روشن داشت خاموش می‌ماند. */
    *:not(.fx-story__bar i):not(.fx-reel__progress i),
    *:not(.fx-story__bar i):not(.fx-reel__progress i)::before,
    *:not(.fx-story__bar i):not(.fx-reel__progress i)::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
    ::view-transition-old(root), ::view-transition-new(root) { animation: none !important; }
}

/* ---------- فرم جست‌وجوی صفحه‌ی اصلی ----------
   قالب برای این فرم `border-radius: 0` گذاشته و وزنش (فرم + تگ) از قانون
   کلی ورودی‌ها بیشتر است، پس جدا نوشته می‌شود. */
form.search-form input,
form.search-form select,
form.search-form .form-control,
form.search-form .form-select {
    border-radius: var(--rf-r-sm);
    border-color: var(--rf-line);
    transition: border-color .16s var(--rf-ease), box-shadow .16s var(--rf-ease);
}
form.search-form input:focus,
form.search-form select:focus {
    border-color: rgba(37, 99, 235, .45);
    box-shadow: 0 0 0 3px var(--rf-accent-soft);
}

/* ---------- کارت ملک در فهرست ---------- */
.listing-item {
    border: 1px solid var(--rf-line);
    box-shadow: var(--rf-shadow-1);
    background: #fff;
    transition: box-shadow .22s var(--rf-ease), transform .22s var(--rf-ease), border-color .22s var(--rf-ease);
}
.listing-item:hover {
    box-shadow: var(--rf-shadow-2);
    transform: translateY(-2px);
    border-color: #d7deeb;
}
.listing-item .left-image img { transition: transform .4s var(--rf-ease); }
.listing-item:hover .left-image img { transform: scale(1.035); }
.listing-item .right-content h4,
.listing-item .right-content h5 { letter-spacing: -.3px; }

/* دکمه‌های کوچک داخل کارت (طاقچه‌ام / دیگر نشان نده) */
.listing-item .theme_btn_2 {
    font-size: 13px;
    box-shadow: 0 1px 2px rgba(21, 25, 40, .1) !important;
}

/* ---------- چک‌باکس و رادیوی فیلترها ---------- */
.checkmark {
    border-radius: 6px !important;
    border-color: var(--rf-line) !important;
    transition: background-color .15s var(--rf-ease), border-color .15s var(--rf-ease), box-shadow .15s var(--rf-ease);
}
.label:hover .checkmark { border-color: rgba(37, 99, 235, .5) !important; }
.radio-btn-groups-label-title {
    border-radius: var(--rf-r-sm) !important;
    transition: background-color .16s var(--rf-ease), color .16s var(--rf-ease),
                box-shadow .16s var(--rf-ease), border-color .16s var(--rf-ease);
}
.radio-btn-groups-label-title:hover { box-shadow: var(--rf-shadow-1); }

/* ---------- نقشه ---------- */
.leaflet-container { border-radius: var(--rf-r-lg); }
.leaflet-popup-content-wrapper { border-radius: var(--rf-r) !important; box-shadow: var(--rf-shadow-2) !important; }
.leaflet-bar a { border-radius: 6px !important; }