/* =========================================================
   AUTO MASTER — نظام التصميم المشترك (Design Tokens)
   الألوان مأخوذة من هوية الشعار:
   - ليموني ساطع (السيارة/AUTO): #C1FF00
   - رمادي الخلفية: #858788
   - فحمي (MASTER): #2D3748
   - أبيض المستطيل: #FFFFFF
   ========================================================= */

:root{
  --lime:#C1FF00;
  --lime-dark:#9FD400;
  --asphalt:#101114;      /* أسود إسفلتي - لخلفيات الهيدر/الشريط الجانبي */
  --brandgray:#858788;    /* رمادي الشعار */
  --charcoal:#2D3748;     /* لون نص MASTER */
  --paper:#F4F4F3;        /* خلفية الصفحة الفاتحة */
  --white:#FFFFFF;
}

*{ -webkit-tap-highlight-color: transparent; }

html, body{ background:var(--paper); }
body{ color:var(--charcoal); }

/* رقام تنسيق ثابت العرض للأرقام (هواتف/إحصائيات) */
.tabular{ font-variant-numeric: tabular-nums; letter-spacing:.02em; }

/* ============ العنصر التوقيعي: الشريط القطري (Livery Stripe) ============
   إشارة بصرية واحدة لكل شاشة، مستوحاة من شريط السيارة في الشعار */
.livery-stripe{ position:relative; overflow:hidden; isolation:isolate; }
.livery-stripe::before{
  content:"";
  position:absolute;
  top:-45%; right:-12%;
  width:60%; height:190%;
  background:var(--lime);
  transform:rotate(16deg);
  opacity:.95;
  z-index:0;
}
.livery-stripe > *{ position:relative; z-index:1; }

/* ============ الشريط السفلي (موبايل فقط) ============ */
.bottom-nav{
  position:fixed; inset-inline:0; bottom:0;
  background:var(--asphalt);
  border-top:1px solid rgba(255,255,255,.08);
  display:flex;
  z-index:40;
  padding-bottom:env(safe-area-inset-bottom);
  box-shadow:0 -8px 20px -8px rgba(0,0,0,.35);
}
.bottom-nav a{
  flex:1; display:flex; flex-direction:column; align-items:center; gap:3px;
  padding:.6rem 0 .5rem;
  color:#9CA3AF;
  font-size:.66rem; font-weight:700;
  text-decoration:none;
}
.bottom-nav a .ic{ font-size:1.05rem; line-height:1; }
.bottom-nav a.active{ color:var(--lime); }
.bottom-nav a .dot{ width:4px; height:4px; border-radius:999px; background:transparent; margin-top:1px; }
.bottom-nav a.active .dot{ background:var(--lime); }
@media (min-width:768px){ .bottom-nav{ display:none; } }

/* ============ زر إجراء عائم (موبايل فقط) ============ */
.fab{
  position:fixed; left:1.1rem; bottom:5.2rem;
  width:3.5rem; height:3.5rem; border-radius:999px;
  background:var(--lime); color:var(--asphalt);
  display:flex; align-items:center; justify-content:center;
  font-size:1.7rem; font-weight:800;
  box-shadow:0 12px 26px -8px rgba(193,255,0,.65), 0 4px 10px rgba(0,0,0,.25);
  z-index:41; text-decoration:none;
  transition:transform .15s ease;
}
.fab:active{ transform:scale(.9); }
@media (min-width:768px){ .fab{ display:none; } }

/* ============ شارات حالة العميل ============ */
.badge{ display:inline-flex; align-items:center; gap:.35rem; padding:.3rem .7rem; border-radius:999px; font-size:.72rem; font-weight:800; }
.badge-new{ background:#DBEAFE; color:#1D4ED8; }
.badge-interested{ background:#FEF3C7; color:#B45309; }
.badge-followup{ background:#FCE7F3; color:#BE185D; }
.badge-sold{ background:#DCFCE7; color:#15803D; }
.badge-notinterested{ background:#F0F0F0; color:#6B7280; }
.badge-asking{ background:#E0E7FF; color:#4338CA; }
.badge-default{ background:#FEF9C3; color:#854D0E; }

/* ============ بطاقات ============ */
.card{ background:var(--white); border:1px solid #EEEEEE; border-radius:1.1rem; }
.card-hover{ transition:box-shadow .2s ease, transform .2s ease; }
.card-hover:hover{ box-shadow:0 10px 30px -12px rgba(16,17,20,.15); transform:translateY(-1px); }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* وضوح التركيز بلوحة المفاتيح */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:2px solid var(--lime);
  outline-offset:2px;
}