/* לוח סטטיסטיקות מרכזי — פלטת אדמין סטנדרטית (ר' dev-principles.md),
   לא ברירת המחדל הגנרית של Bootstrap. */
:root {
  --admin-primary: #4338ca;
  --admin-primary-hover: #3730a3;
  --admin-sidebar-bg: #1e1b3a;
  --admin-bg: #f8f7fc;
  --admin-card-bg: #ffffff;
  --admin-card-radius: .75rem;
  --admin-card-shadow: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --admin-danger: #b3261e;
  --admin-warn: #92400e;
  --admin-warn-bg: #fef3c7;
}

* { box-sizing: border-box; }

body {
  font-family: 'Heebo', system-ui, sans-serif;
  background: var(--admin-bg);
  color: #1f1b3d;
  margin: 0;
}

.skip-link {
  position: absolute; right: -9999px; top: 0; z-index: 2000;
  background: #fff; padding: .5rem 1rem; border-radius: 0 0 0 .5rem;
}
.skip-link:focus { right: 0; }

/* ─── סרגל עליון ─────────────────────────────────────────────────────── */
.topbar {
  background: var(--admin-sidebar-bg);
  color: #fff;
}
.topbar-inner {
  max-width: 1280px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  padding: .75rem 1rem;
}
.topbar .brand { font-weight: 800; font-size: 1.1rem; display: flex; align-items: center; gap: .5rem; }

main.container-fluid { max-width: 1280px; }

/* ─── כפתורים/הדגשות — עוקף כחול Bootstrap הגנרי ────────────────────── */
.btn-primary, .range-btn.active {
  background-color: var(--admin-primary) !important;
  border-color: var(--admin-primary) !important;
}
.btn-primary:hover { background-color: var(--admin-primary-hover) !important; border-color: var(--admin-primary-hover) !important; }
.btn-outline-primary { color: var(--admin-primary); border-color: var(--admin-primary); }
.btn-outline-primary:hover, .btn-outline-primary.active { background-color: var(--admin-primary); border-color: var(--admin-primary); }

.hint { color: #6b6485; font-size: .875rem; }

/* ─── כרטיסים ────────────────────────────────────────────────────────── */
.card {
  border: none;
  border-radius: var(--admin-card-radius);
  box-shadow: var(--admin-card-shadow);
}

.stat-card { cursor: pointer; transition: transform .12s ease, box-shadow .12s ease; height: 100%; }
.stat-card:hover, .stat-card:focus-visible { transform: translateY(-2px); box-shadow: 0 4px 14px rgba(67,56,202,.18); outline: none; }
.stat-card-title { font-size: .95rem; font-weight: 600; margin-bottom: .5rem; color: #443f6b; }
.stat-main { font-size: 1.9rem; font-weight: 800; color: var(--admin-primary); line-height: 1.1; }
.stat-main small { display: block; font-size: .75rem; font-weight: 400; color: #6b6485; margin-top: .15rem; }
.stat-sub-row { display: flex; gap: 1rem; margin-top: .5rem; font-size: .82rem; color: #4b4570; flex-wrap: wrap; }
.stat-card-warn {
  margin-top: .5rem; font-size: .78rem; color: var(--admin-warn);
  background: var(--admin-warn-bg); border-radius: .5rem; padding: .25rem .5rem; display: inline-block;
}

.metric-error { color: var(--admin-danger); font-weight: 600; font-size: .95rem; }

.mini-stat {
  display: flex; align-items: center; gap: .6rem;
  background: #f4f2fc; border-radius: .6rem; padding: .65rem .75rem; height: 100%;
}
.mini-stat i { color: var(--admin-primary); font-size: 1.15rem; width: 1.4rem; text-align: center; }
.mini-stat b { display: block; font-size: 1.1rem; }
.mini-stat small { display: block; color: #6b6485; font-size: .75rem; }

.chart-wrap { position: relative; height: 260px; }

/* ─── כניסה ──────────────────────────────────────────────────────────── */
.login-body {
  font-family: 'Heebo', system-ui, sans-serif;
  background: var(--admin-sidebar-bg);
  min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  margin: 0; padding: 1rem;
}
.login-wrap { width: 100%; max-width: 380px; }
.login-card {
  background: #fff; border-radius: 1rem; padding: 2rem 1.75rem;
  box-shadow: 0 20px 50px rgba(0,0,0,.35); text-align: center;
}
.login-logo { font-size: 2.2rem; color: var(--admin-primary); margin-bottom: .5rem; }
.login-card h1 { font-size: 1.3rem; font-weight: 800; margin-bottom: .1rem; }

/* ─── מובייל: ריווח מצומצם, בלי רוחב קבוע בשום מקום ─────────────────── */
@media (max-width: 767.98px) {
  .topbar-inner { padding: .6rem .75rem; }
  .stat-main { font-size: 1.6rem; }
  .chart-wrap { height: 220px; }
}


/* ═══ גולשים בזמן אמת ═══════════════════════════════════════════════ */
.rt-card { border-inline-start: 4px solid #22c55e; }
.rt-total { display: flex; align-items: center; gap: 8px; font-size: 1.6rem; font-weight: 800; }
.rt-total .rt-label { font-size: .85rem; font-weight: 600; color: #6b7280; }
/* ⚠️ הנקודה פועמת רק כשיש גולשים. סימן "חי" שדולק גם כשאין איש
   מאבד את המשמעות שלו — הוא הופך לקישוט. */
.rt-dot { width: 10px; height: 10px; border-radius: 50%; background: #d1d5db; flex-shrink: 0; }
.rt-card.is-live .rt-dot { background: #22c55e; animation: rtPulse 1.8s ease-in-out infinite; }
@keyframes rtPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(34,197,94,.55); } 50% { box-shadow: 0 0 0 7px rgba(34,197,94,0); } }
.rt-sites { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.rt-sites .rt-site { white-space: nowrap; }
.rt-sites .rt-site b { color: #111827; }
@media (max-width: 575px) { .rt-total { font-size: 1.3rem; } }

/* ⚠️ הדומיין מתחת לשם הנכס. `dir=ltr` כי הוא לטיני בתוך עמוד RTL —
   בלעדיו "shop.aharon-bas.co.il" מוצג עם הסדר הפוך. */
.stat-card-domain {
  font-size: .72rem; font-weight: 600; color: #9aa3b2;
  margin-block-start: -2px; margin-block-end: 6px;
  letter-spacing: .01em; text-align: start;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* נכס בלי אתר חי — נאמר במפורש ולא מושאר ריק. */
.stat-card-domain-none { color: #c99a2e; font-style: italic; }

/* שם הדף גדול, הנתיב קטן מתחתיו. `dir=ltr` על הנתיב — הוא לטיני
   בתוך טבלה עברית, ובלעדיו "/b/17817" מוצג בסדר הפוך. */
.page-title { font-weight: 600; max-width: 300px; }
.page-path  { font-size: .72rem; color: #9aa3b2; max-width: 300px; text-align: start; }