/* ═══════════════════════════════════════════════════════════════
   VAL Solutions — طبقة تصميم لوحة التاجر (فوق قالب OvoSale)
   بصريّة بالكامل — لا تمسّ أي منطق. تُحمَّل بعد main.css فتتغلّب عليه.
   ═══════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800;900&family=Cairo:wght@700;800;900&family=Inter:wght@400;500;600;700;800&display=swap');

:root{
  --vp-bg:#F7F7FB; --vp-surface:#FFFFFF; --vp-border:#ECEAF3;
  --vp-text:#171422; --vp-text-2:#5B5670; --vp-text-3:#9A95AD;
  --vp-primary:#7C5CFC; --vp-primary-dark:#5B3DE0; --vp-primary-soft:#F1ECFF;
  --vp-ink:#161225; --vp-mint:#3ECF8E; --vp-gold:#F5B544; --vp-coral:#FF7A5C;
  --vp-r:14px; --vp-r-lg:20px;
  --vp-sh-sm:0 1px 3px rgba(23,20,34,.05);
  --vp-sh-md:0 8px 26px rgba(23,20,34,.07);
  --vp-sh-lg:0 24px 60px rgba(23,20,34,.10);
}

/* ── الأساس ── */
body{ background:var(--vp-bg)!important; font-family:'Tajawal',sans-serif!important; color:var(--vp-text); }
h1,h2,h3,h4,h5,h6,.dash-card-title{ font-family:'Cairo','Tajawal',sans-serif!important; letter-spacing:-.4px; }
::selection{ background:var(--vp-primary-soft); }
*{ scrollbar-width:thin; scrollbar-color:#D9D5E6 transparent; }
*::-webkit-scrollbar{ width:8px; height:8px; }
*::-webkit-scrollbar-thumb{ background:#D9D5E6; border-radius:99px; }
*::-webkit-scrollbar-thumb:hover{ background:var(--vp-primary); }

/* ── الشريط الجانبي ── */
.dashboard__sidebar{ background:var(--vp-surface)!important; border-inline-end:1px solid var(--vp-border)!important; box-shadow:var(--vp-sh-sm); }
.dashboard__sidebar-header{ padding-block:18px!important; border-bottom:1px solid var(--vp-border); }
.dashboard__sidebar-logo img{ max-height:40px; width:auto; }
.dashboard-nav__title{ padding:16px 22px 6px!important; }
.dashboard-nav__title-text{ font-family:'Inter',sans-serif!important; font-size:.68rem!important; font-weight:700!important; letter-spacing:.12em!important; text-transform:uppercase; color:var(--vp-text-3)!important; }
.dashboard-nav__link{ position:relative; margin:2px 12px!important; padding:11px 14px!important; border-radius:12px!important; color:var(--vp-text-2)!important; font-weight:600!important; font-size:.94rem!important; transition:all .18s ease!important; }
.dashboard-nav__link:hover{ background:var(--vp-primary-soft)!important; color:var(--vp-primary-dark)!important; }
.dashboard-nav__link-icon{ transition:transform .18s ease; }
.dashboard-nav__link:hover .dashboard-nav__link-icon{ transform:scale(1.12); color:var(--vp-primary)!important; }
.dashboard-nav__link.active,.dashboard-nav__items.active > .dashboard-nav__link{
  background:linear-gradient(120deg,var(--vp-primary),var(--vp-primary-dark))!important;
  color:#fff!important; box-shadow:0 8px 20px rgba(124,92,252,.30)!important;
}
.dashboard-nav__link.active .dashboard-nav__link-icon,
.dashboard-nav__items.active > .dashboard-nav__link .dashboard-nav__link-icon{ color:#fff!important; }
.sidebar-submenu .dashboard-nav__link{ margin:1px 12px 1px 20px!important; font-size:.88rem!important; }
.sidebar-submenu .dashboard-nav__link.active{ background:var(--vp-primary-soft)!important; color:var(--vp-primary-dark)!important; box-shadow:none!important; }
.nav-badge{ border-radius:99px!important; }

/* ── الشريط العلوي ── */
.dashboard__header{ background:rgba(255,255,255,.72)!important; backdrop-filter:blur(18px) saturate(180%); -webkit-backdrop-filter:blur(18px) saturate(180%); border-bottom:1px solid var(--vp-border)!important; box-shadow:none!important; }
.header-search__input{ background:var(--vp-bg)!important; border:1px solid var(--vp-border)!important; border-radius:12px!important; font-family:'Tajawal',sans-serif!important; }
.header-search__input:focus{ border-color:var(--vp-primary)!important; box-shadow:0 0 0 3px rgba(124,92,252,.12)!important; }
.header-dropdown__icon{ border-radius:12px!important; transition:.18s; }
.header-dropdown__icon:hover{ background:var(--vp-primary-soft)!important; color:var(--vp-primary)!important; }
.dropdown-menu{ border:1px solid var(--vp-border)!important; border-radius:16px!important; box-shadow:var(--vp-sh-lg)!important; padding:8px!important; }
.dropdown-menu__item{ border-radius:10px!important; }

/* ── البطاقات ── */
.dash-card,.card,.custom--card{ background:var(--vp-surface)!important; border:1px solid var(--vp-border)!important; border-radius:var(--vp-r-lg)!important; box-shadow:var(--vp-sh-sm)!important; transition:box-shadow .25s ease,transform .25s ease; }
.dash-card:hover{ box-shadow:var(--vp-sh-md)!important; }
.dash-card-title{ font-weight:800!important; color:var(--vp-text)!important; }
.dash-card-subtitle,.dash-card-head small{ color:var(--vp-text-3)!important; }

/* ── الجداول ── */
.dash-table,table.custom--table,.table{ border-color:var(--vp-border)!important; }
.dash-table thead th,.custom--table thead th,.table thead th{ background:var(--vp-bg)!important; color:var(--vp-text-2)!important; font-family:'Inter',sans-serif!important; font-size:.78rem!important; font-weight:700!important; text-transform:uppercase; letter-spacing:.04em; border:0!important; }
.dash-table tbody tr,.custom--table tbody tr{ transition:background .15s ease; }
.dash-table tbody tr:hover,.custom--table tbody tr:hover{ background:var(--vp-primary-soft)!important; }
.dash-table td,.custom--table td{ border-color:var(--vp-border)!important; }

/* ── الأزرار ── */
.btn--base,.btn--primary{ background:linear-gradient(120deg,var(--vp-primary),var(--vp-primary-dark))!important; border:0!important; border-radius:12px!important; font-weight:700!important; box-shadow:0 8px 20px rgba(124,92,252,.24)!important; transition:transform .18s ease,box-shadow .25s ease!important; }
.btn--base:hover,.btn--primary:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(124,92,252,.34)!important; }
.btn-outline--primary{ border-radius:12px!important; }
.btn{ border-radius:12px!important; }

/* ── الحقول ── */
.form-control,.form--control,.form-select{ border-radius:12px!important; border-color:var(--vp-border)!important; }
.form-control:focus,.form--control:focus,.form-select:focus{ border-color:var(--vp-primary)!important; box-shadow:0 0 0 3px rgba(124,92,252,.12)!important; }

/* ── الشارات والحالات ── */
.badge,.text--badge{ border-radius:99px!important; font-weight:700!important; }
.status--active,.badge--success{ background:var(--vp-mint)!important; }

/* ── بحث القائمة (VAL) ── */
.val-menu-search{ padding:12px 16px 4px; }
.val-menu-search input{ width:100%; background:var(--vp-bg); border:1px solid var(--vp-border); border-radius:12px; padding:9px 14px; font-family:'Tajawal',sans-serif; font-size:.88rem; color:var(--vp-text); }
.val-menu-search input:focus{ outline:none; border-color:var(--vp-primary); box-shadow:0 0 0 3px rgba(124,92,252,.12); }
.val-menu-hidden{ display:none!important; }

/* ── انتقالات عامّة ناعمة ── */
a,.btn,.dashboard-nav__link,.header-dropdown__icon,.dash-card{ transition-timing-function:cubic-bezier(.22,1,.36,1); }

/* ═══════════ لمسات UX (المرحلة ٧) ═══════════ */

/* دخول الصفحة بتلاشٍ ناعم */
@keyframes valPageIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
.dashboard-body,.dashboard__body,main.page-wrapper,.dashboard-main-content{ animation:valPageIn .4s cubic-bezier(.22,1,.36,1) both; }
@media (prefers-reduced-motion:reduce){ *{ animation-duration:.001ms!important; } }

/* تنبيهات iziToast — بهوية VAL */
.iziToast{ border-radius:14px!important; box-shadow:var(--vp-sh-lg)!important; font-family:'Tajawal',sans-serif!important; border:0!important; }
.iziToast>.iziToast-body .iziToast-title{ font-family:'Cairo',sans-serif!important; font-weight:800!important; }
.iziToast.iziToast-color-green,.iziToast-color-green{ background:#ECFDF5!important; }
.iziToast.iziToast-color-red,.iziToast-color-red{ background:#FEF2F2!important; }
.iziToast>.iziToast-progressbar>div{ background:var(--vp-primary)!important; }

/* مودالات حديثة */
.modal-content{ border:0!important; border-radius:20px!important; box-shadow:var(--vp-sh-lg)!important; overflow:hidden; }
.modal-header{ border-bottom:1px solid var(--vp-border)!important; padding:18px 22px!important; }
.modal-header .modal-title{ font-family:'Cairo',sans-serif!important; font-weight:800!important; }
.modal-body{ padding:22px!important; }
.modal-footer{ border-top:1px solid var(--vp-border)!important; }
.modal.fade .modal-dialog{ transition:transform .3s cubic-bezier(.22,1,.36,1),opacity .3s!important; }
.modal-backdrop.show{ backdrop-filter:blur(3px); opacity:.4!important; }

/* SweetAlert (إن استُخدم) */
.swal2-popup{ border-radius:20px!important; font-family:'Tajawal',sans-serif!important; }
.swal2-styled.swal2-confirm{ background:linear-gradient(120deg,var(--vp-primary),var(--vp-primary-dark))!important; border-radius:12px!important; box-shadow:0 8px 20px rgba(124,92,252,.28)!important; }

/* حالات فارغة (Empty state) */
.dash-table-empty,.empty-message,.no-data{ padding:40px 20px!important; text-align:center; color:var(--vp-text-3)!important; }
.dash-table-empty i,.empty-message i{ font-size:2.4rem; color:var(--vp-primary); opacity:.6; display:block; margin-bottom:10px; }

/* Skeleton loading (أداة قابلة لإعادة الاستخدام) */
@keyframes valShimmer{ 0%{ background-position:-460px 0; } 100%{ background-position:460px 0; } }
.val-skeleton{ background:linear-gradient(90deg,#EFEDF6 25%,#F7F6FB 37%,#EFEDF6 63%); background-size:920px 100%; animation:valShimmer 1.4s ease-in-out infinite; border-radius:8px; min-height:14px; display:block; }
.val-skeleton.line{ height:14px; margin-bottom:10px; }
.val-skeleton.title{ height:22px; width:45%; margin-bottom:16px; }
.val-skeleton.card{ height:120px; border-radius:var(--vp-r-lg); }

/* أزرار وبطاقات — رفع لطيف عند المرور */
.dash-card{ will-change:transform; }
.btn:active{ transform:translateY(0)!important; }

/* حقول اختيار select2 — بهوية VAL */
.select2-container--default .select2-selection--single{ border-radius:12px!important; border-color:var(--vp-border)!important; height:auto!important; padding:5px 6px; }
.select2-dropdown{ border-radius:12px!important; border-color:var(--vp-border)!important; box-shadow:var(--vp-sh-md)!important; }
.select2-container--default .select2-results__option--highlighted[aria-selected]{ background:var(--vp-primary)!important; }

/* Focus واضح للوصوليّة */
:focus-visible{ outline:3px solid rgba(124,92,252,.4); outline-offset:2px; border-radius:8px; }