/*
 * ============================================================
 *  admin.css — لوحة تحكم المدير (Admin Dashboard)
 * ============================================================
 *  يحتوي على كل ما يخص لوحة الأدمن بالكامل:
 *
 *  [ شاشة تسجيل الدخول ]
 *    • .admin-login-screen     — الخلفية الكاملة لشاشة الدخول
 *    • .admin-login-card.pro   — البطاقة البيضاء لفورم الدخول
 *    • .admin-login-brand      — اللوغو واسم المتجر في الفورم
 *    • .admin-login-form.pro   — فورم إدخال رقم المدير وكلمة المرور
 *
 *  [ هيكل اللوحة الرئيسية ]
 *    • .admin-app              — الشبكة الرئيسية (sidebar + workspace)
 *    • .admin-left-nav         — الشريط الجانبي الداكن على اليسار
 *    • .admin-logo-box         — اللوغو أعلى الشريط الجانبي
 *    • .admin-tab-btn          — أزرار التبويب في الشريط الجانبي
 *    • .admin-logout-wide      — زر تسجيل الخروج
 *    • .admin-workspace        — منطقة العمل الرئيسية
 *
 *  [ الشريط العلوي للوحة ]
 *    • .admin-topbar           — الشريط العلوي الأبيض
 *    • .admin-user-pill        — بطاقة معلومات المدير
 *
 *  [ إحصائيات اللوحة ]
 *    • .admin-metric-grid      — شبكة البطاقات الإحصائية الأربع
 *    • .admin-analytics-row    — صف التحليلات (أكثر مبيعًا، آخر طلبات...)
 *    • .admin-soft-card        — البطاقة البيضاء الناعمة
 *    • .admin-insight-box      — صندوق المعلومة الواحدة
 *    • .admin-mini-list        — قائمة آخر الطلبات المصغرة
 *
 *  [ صفحات الأدمن ]
 *    • .admin-page             — لوح صفحة أدمن (يُخفى/يُظهر)
 *    • .admin-section-head     — رأس القسم مع زر الإضافة
 *    • .admin-two-col          — تخطيط عمودين (فورم + قائمة)
 *
 *  [ إدارة المنتجات ]
 *    • .admin-product-form     — فورم إضافة/تعديل المنتج
 *    • .admin-products-list    — قائمة المنتجات
 *    • .admin-product-row      — صف منتج واحد في القائمة
 *    • .product-unavailable    — تأثير المنتج غير المتوفر
 *
 *  [ إدارة الطلبات ]
 *    • .admin-orders-list      — قائمة الطلبات
 *    • .admin-order-card       — بطاقة طلب واحد
 *    • .admin-order-head       — رأس بطاقة الطلب
 *    • .admin-order-meta       — تفاصيل الطلب (شبكة 4 أعمدة)
 *    • .admin-actions          — أزرار إجراءات الطلب
 *    • .admin-status-btn       — زر تغيير حالة الطلب
 *
 *  [ إدارة الموظفين ]
 *    • .admin-staff-list       — قائمة الموظفين
 *    • .admin-staff-row        — صف موظف واحد
 * ============================================================
 */

/* ===== إخفاء/إظهار شاشات الأدمن ===== */
.admin-app.hidden-account,
#admin-dashboard.hidden-account { display: none!important; }
.admin-login-screen.hidden-account,
#admin-login-card.hidden-account { display: none!important; }

/* ===== الهيكل العام ===== */
.admin-view {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  min-height: calc(100vh - var(--header-h));
  background: #f5f7ff;
  color: #1d1730;
  direction: rtl;
}

/* ===== شاشة تسجيل الدخول ===== */
.admin-login-screen {
  min-height: calc(100vh - var(--header-h));
  display: grid;
  place-items: center;
  padding: 38px;
  background:
    radial-gradient(circle at top right,rgba(126,87,255,.22),transparent 34%),
    linear-gradient(135deg,#f8f9ff,#eef1ff);
}
.admin-login-card.pro {
  width: min(480px,100%);
  background: #fff;
  border: 1px solid rgba(95,71,190,.14);
  border-radius: 34px;
  padding: 34px;
  box-shadow: 0 28px 80px rgba(49,38,112,.18);
  text-align: right;
}
.admin-login-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 22px;
  color: #6552d9;
  font-weight: 900;
}
.admin-login-brand img { width: 44px; height: 44px; border-radius: 16px; object-fit: cover; }
.admin-login-card.pro h1 { font-size: 42px; margin: 0 0 10px; color: #1d1730; }
.admin-login-card.pro p,
.admin-login-card.pro small { color: #716b83; }
.admin-login-form.pro { display: grid; gap: 10px; margin-top: 24px; }
.admin-login-form.pro label { font-weight: 900; color: #1d1730; }
.admin-login-form.pro input,
.admin-product-form input,
.admin-product-form select,
.admin-product-form textarea {
  width: 100%;
  border: 1px solid #e3def3;
  background: #fff;
  color: #1d1730;
  border-radius: 16px;
  padding: 13px 15px;
  font: inherit;
  outline: none;
}
.admin-login-form.pro input:focus,
.admin-product-form input:focus,
.admin-product-form select:focus,
.admin-product-form textarea:focus {
  border-color: #725cff;
  box-shadow: 0 0 0 4px rgba(114,92,255,.1);
}

/* ===== هيكل اللوحة الرئيسية ===== */
.admin-app {
  display: grid;
  grid-template-columns: 250px 1fr;
  min-height: calc(100vh - var(--header-h));
  background: #f5f7ff;
}

/* الشريط الجانبي */
.admin-left-nav {
  background: #17112b;
  color: #fff;
  padding: 24px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: sticky;
  top: var(--header-h);
  height: calc(100vh - var(--header-h));
}
.admin-logo-box { display: flex; align-items: center; gap: 12px; margin-bottom: 26px; }
.admin-logo-box img { width: 46px; height: 46px; border-radius: 16px; object-fit: cover; }
.admin-tab-btn {
  border: 0;
  border-radius: 18px;
  background: transparent;
  color: #cfc8e9;
  padding: 15px 16px;
  text-align: right;
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 900;
  cursor: pointer;
}
.admin-tab-btn span { width: 32px; height: 32px; border-radius: 12px; background: rgba(255,255,255,.08); display: grid; place-items: center; }
.admin-tab-btn.active,
.admin-tab-btn:hover { background: #6d55ff; color: #fff; box-shadow: 0 12px 34px rgba(109,85,255,.3); }
.admin-logout-wide { margin-top: auto; border: 0; border-radius: 18px; background: rgba(255,255,255,.1); color: #fff; padding: 14px; font-weight: 900; cursor: pointer; }

/* منطقة العمل */
.admin-workspace { padding: 28px; max-width: 1260px; width: 100%; margin: 0 auto; }

/* الشريط العلوي */
.admin-topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  background: #fff;
  border-radius: 28px;
  padding: 24px 28px;
  margin-bottom: 22px;
  box-shadow: 0 18px 50px rgba(46,37,96,.08);
}
.admin-topbar p { margin: 0; color: #716b83; font-weight: 800; }
.admin-topbar h1 { font-size: 34px; margin: 4px 0 0; color: #1d1730; }
.admin-user-pill { display: flex; align-items: center; gap: 12px; background: #f4f2ff; border-radius: 20px; padding: 10px 14px; color: #1d1730; }
.admin-user-pill span { font-size: 28px; }
.admin-user-pill small { display: block; color: #716b83; direction: ltr; text-align: right; }

/* ===== بطاقات الإحصائيات ===== */
.admin-metric-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 18px;
  margin-bottom: 22px;
}
.admin-metric-grid article {
  position: relative;
  overflow: hidden;
  border-radius: 28px;
  padding: 24px;
  background: linear-gradient(135deg,#fff,#f8f7ff);
  box-shadow: 0 18px 45px rgba(46,37,96,.08);
  border: 1px solid #ece8fb;
}
.admin-metric-grid article:nth-child(1) { background: linear-gradient(135deg,#fff4d8,#ffc85d); }
.admin-metric-grid article:nth-child(2) { background: linear-gradient(135deg,#e5fbff,#90e7ff); }
.admin-metric-grid article:nth-child(3) { background: linear-gradient(135deg,#efe8ff,#bba6ff); }
.admin-metric-grid article:nth-child(4) { background: linear-gradient(135deg,#ffeaf3,#ff9fc6); }
.admin-metric-grid span { font-weight: 900; color: #504765; }
.admin-metric-grid strong { display: block; font-size: 34px; margin: 8px 0; color: #1d1730; }
.admin-metric-grid small { color: #605870; font-weight: 800; }

/* ===== صف التحليلات ===== */
.admin-analytics-row { display: grid; grid-template-columns: 1fr 1fr 1.2fr; gap: 18px; margin-bottom: 22px; }
.admin-soft-card { background: #fff; border: 1px solid #ece8fb; border-radius: 28px; padding: 22px; box-shadow: 0 18px 45px rgba(46,37,96,.08); color: #1d1730; }
.admin-soft-card h2,
.admin-section-head h2 { font-size: 26px; text-align: right; margin: 0 0 12px; color: #1d1730; text-shadow: none; }
.admin-insight-box { display: grid; gap: 8px; min-height: 86px; }
.admin-insight-box strong { font-size: 20px; color: #1d1730; }
.admin-insight-box span { color: #716b83; }
.admin-insight-box b { color: #6d55ff; }
.admin-mini-list { display: grid; gap: 10px; }
.admin-mini-list div { display: flex; justify-content: space-between; gap: 12px; padding: 10px; border-radius: 14px; background: #f7f6ff; }
.admin-mini-list span { color: #716b83; }

/* ===== صفحات الأدمن ===== */
.admin-page { display: none; animation: fadeAccount .22s ease; }
.admin-page.active { display: block; }
.admin-section-head { display: flex; justify-content: space-between; align-items: center; gap: 18px; margin: 12px 0 18px; }
.admin-section-head p { margin: 0; color: #716b83; }
.admin-two-col { display: grid; grid-template-columns: 390px 1fr; gap: 18px; align-items: start; }

/* ===== فورم المنتج ===== */
.admin-product-form { display: grid; gap: 10px; }
.admin-product-form textarea { min-height: 96px; resize: vertical; }

/* ===== قوائم المنتجات والطلبات والموظفين ===== */
.admin-products-list,
.admin-orders-list,
.admin-staff-list { display: grid; gap: 12px; }

.admin-product-row,
.admin-order-card,
.admin-staff-row {
  background: #fff;
  border: 1px solid #ece8fb;
  border-radius: 22px;
  padding: 14px;
  box-shadow: 0 12px 30px rgba(46,37,96,.06);
  color: #1d1730;
}

/* صف المنتج */
.admin-product-row { display: grid; grid-template-columns: 68px 1fr auto auto auto auto; gap: 12px; align-items: center; }
.admin-product-row img { width: 68px; height: 68px; border-radius: 18px; object-fit: cover; }
.admin-product-row strong,
.admin-staff-row strong { display: block; color: #1d1730; }
.admin-product-row span,
.admin-staff-row span,
.admin-order-meta span { color: #716b83; }
.admin-product-row button,
.admin-status-btn { border: 1px solid #e3def3; background: #f8f7ff; color: #44386b; border-radius: 14px; padding: 9px 12px; font-weight: 900; cursor: pointer; }
.admin-product-row button:hover,
.admin-status-btn:hover { background: #6d55ff; color: #fff; }
.product-unavailable { opacity: .58; filter: grayscale(.25); }

/* بطاقة الطلب */
.admin-order-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.admin-order-head strong { font-size: 22px; }
.admin-order-meta { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin-bottom: 12px; }
.admin-order-card p { color: #44386b; }
.admin-order-card b { display: block; color: #6d55ff; font-size: 22px; margin-bottom: 12px; }
.admin-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* صف الموظف */
.admin-staff-row { display: flex; justify-content: space-between; align-items: center; }
.admin-staff-row em { font-style: normal; background: #e9fff5; color: #06945f; border-radius: 999px; padding: 8px 12px; font-weight: 900; }
.staff-card .primary-btn { margin-top: 16px; }

/* حالة المنتج في الأدمن */
.admin-view .status-pill { background: #e9fff5; color: #06945f; border-color: #b7f5dc; }
.admin-view .status-pill.unavailable { background: #fff0f0; color: #dc4058; border-color: #ffd0d6; }

/* أزرار الأدمن */
.admin-view .primary-btn { background: linear-gradient(135deg,#6d55ff,#8f4dff); box-shadow: 0 12px 30px rgba(109,85,255,.25); }
.admin-view .secondary-btn { background: #fff; color: #6d55ff; border: 1px solid #dcd5ff; box-shadow: none; }

/* ===== RESPONSIVE ===== */
@media(max-width:1050px){
  .admin-app { grid-template-columns: 1fr; }
  .admin-left-nav { position: static; height: auto; flex-direction: row; overflow-x: auto; }
  .admin-logout-wide { margin-top: 0; margin-inline-start: auto; }
  .admin-metric-grid,
  .admin-analytics-row,
  .admin-two-col { grid-template-columns: 1fr; }
  .admin-product-row { grid-template-columns: 58px 1fr; }
  .admin-product-row .status-pill,
  .admin-product-row button { grid-column: 1 / -1; }
  .admin-order-meta { grid-template-columns: 1fr; }
  .admin-topbar { flex-direction: column; align-items: flex-start; }
}