/* =========================================================
   SIMSAR BRAND THEME
   نسخة سمسار من تطبيق العميل العقاري
   Red + White + Soft Coral
   ========================================================= */

:root {
  --blue: #E3361F;
  --blue2: #B92515;
  --orange: #FF8C7E;
  --orange2: #FFC0B8;
  --simsar-red: #E3361F;
  --simsar-dark-red: #B92515;
  --simsar-coral: #FFB4AA;
  --simsar-soft: #FFF0ED;
  --simsar-ink: #22110E;
}

body {
  background:
    radial-gradient(circle at top left, rgba(227,54,31,.18), transparent 28%),
    radial-gradient(circle at top right, rgba(255,180,170,.28), transparent 24%),
    linear-gradient(180deg, #FFF8F6, var(--bg, #F5F8FE)) !important;
}

html[data-theme="dark"] body {
  background:
    radial-gradient(circle at top left, rgba(227,54,31,.22), transparent 28%),
    radial-gradient(circle at top right, rgba(255,180,170,.12), transparent 24%),
    linear-gradient(180deg, #170604, #25100D) !important;
}

.brand { min-height: 54px; }

.brand-mark {
  background: #E3361F !important;
  box-shadow: 0 18px 40px rgba(227,54,31,.28) !important;
}

.brand-mark::after {
  background: #FFB4AA !important;
  box-shadow: 0 0 0 8px rgba(255,180,170,.26) !important;
}

.simsar-logo-img {
  width: 52px;
  height: 52px;
  border-radius: 18px;
  object-fit: cover;
  box-shadow: 0 18px 40px rgba(227,54,31,.26);
}

.side-rail { border-right-color: rgba(227,54,31,.16) !important; }

.rail-nav button i {
  background: #FFF0ED !important;
  color: #E3361F !important;
}

.rail-nav button.active,
.rail-nav button:hover {
  background: linear-gradient(135deg, #E3361F, #B92515) !important;
  box-shadow: 0 16px 36px rgba(227,54,31,.22) !important;
}

.rail-nav button.active i,
.rail-nav button:hover i {
  background: rgba(255,255,255,.18) !important;
  color: #fff !important;
}

.rail-card {
  background:
    radial-gradient(circle at top right, rgba(255,180,170,.34), transparent 36%),
    linear-gradient(135deg, #B92515, #E3361F) !important;
}

.btn.blue,
.btn.orange,
.segmented button.active,
.segmented button:hover,
.tabs button.active,
.tabs button:hover,
.map-chips button.active,
.vr-room-tabs button.active,
.vr-tool-row button.active {
  background: linear-gradient(135deg, #E3361F, #B92515) !important;
  color: #fff !important;
  border-color: transparent !important;
}

.btn.light,
.btn.ghost {
  background: #FFF0ED !important;
  color: #E3361F !important;
  border-color: #FFD0CA !important;
}

.icon-btn,
.top-search span,
.price,
.kpis b,
.kpi-strip b,
.mini-stats b,
.wallet-grid b {
  color: #E3361F !important;
}

.hero,
.hero-premium {
  background: #B92515 !important;
}

.hero-bg {
  background:
    linear-gradient(90deg, rgba(93,15,9,.92), rgba(227,54,31,.58), rgba(255,180,170,.22)),
    url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=1800&q=85') center/cover !important;
}

.eyebrow {
  background: rgba(255,255,255,.18) !important;
  border-color: rgba(255,255,255,.28) !important;
}

.badge.sale,
.badge.rent,
.reward-line strong,
.map-list-card strong,
.status.orange {
  color: #E3361F !important;
}

.badge.reward { color: #B92515 !important; }

.reward-line,
.hint-card,
.auth-lock-card,
.vr-panel-block {
  background: linear-gradient(135deg, #FFF7F5, #FFF0ED) !important;
  border-color: #FFD7D1 !important;
}

.property-card:hover,
.project-card:hover,
.map-list-card:hover,
.map-list-card.active {
  border-color: rgba(227,54,31,.36) !important;
  box-shadow: 0 20px 54px rgba(227,54,31,.14) !important;
}

.wallet-hero,
.showcase-hero {
  background:
    radial-gradient(circle at top right, rgba(255,180,170,.45), transparent 38%),
    linear-gradient(135deg, #B92515, #E3361F) !important;
}

.vr-photo-hotspot.is-scene,
.vr-action-btn.blue,
.vr-action-btn.orange {
  background: linear-gradient(135deg, #E3361F, #B92515) !important;
}

.vr-top-glass small,
.map-floating small,
.map-floating-card small {
  background: #FFF0ED !important;
  color: #E3361F !important;
}

.phone-head,
.device-top {
  background: linear-gradient(135deg, #E3361F, #B92515) !important;
}

.phone-body span,
.device-body span {
  background: #FFF0ED !important;
  color: #E3361F !important;
}

.toast { background: linear-gradient(135deg, #E3361F, #B92515) !important; }

.simsar-tagline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #FFF0ED;
  color: #E3361F;
  border: 1px solid #FFD0CA;
  border-radius: 999px;
  padding: 8px 11px;
  font-weight: 1000;
  font-size: 12px;
}

@media (max-width: 900px) {
  .simsar-logo-img {
    width: 44px;
    height: 44px;
    border-radius: 15px;
  }
}
