/* jaspayaja v28 — Panel Admin claymorphism (sidebar, cards, tables, inputs). Loaded after jp-admin.css. */
html.jpa-on{
  --jx-page:#ECE6FA;--jx-side:#F6F2FF;--jx-card:#F7F3FF;--jx-card-2:#EEE7FC;--jx-line:rgba(124,58,237,.10);--jx-text:#2A1F4A;--jx-muted:#6D628C;
  --jx-accent:#8B5CF6;--jx-accent-hover:#7C3AED;--jx-accent-text:#6D28D9;--jx-accent-bg:rgba(139,92,246,.14);--jx-accent-line:rgba(139,92,246,.3);--jx-row-hover:#EFE8FD;
  --cl-out:14px 16px 32px rgba(92,62,170,.22),-10px -10px 24px rgba(255,255,255,.95);
  --cl-in:inset 6px 6px 12px rgba(255,255,255,.95),inset -8px -10px 18px rgba(124,58,237,.12);
  --cl-press:inset 5px 5px 10px rgba(104,72,180,.18),inset -5px -5px 10px rgba(255,255,255,.9);
  --cl-r:28px}
html.jpa-on.dark{
  --jx-page:#17122A;--jx-side:#241C40;--jx-card:#251D42;--jx-card-2:#2D2350;--jx-line:rgba(255,255,255,.06);--jx-text:#F3EEFF;--jx-muted:#B4A9D6;
  --jx-accent:#A78BFA;--jx-accent-hover:#8B5CF6;--jx-accent-text:#D8C8FF;--jx-accent-bg:rgba(167,139,250,.16);--jx-accent-line:rgba(167,139,250,.3);--jx-row-hover:#2C2350;
  --cl-out:14px 16px 32px rgba(4,1,14,.6),-8px -8px 22px rgba(120,90,220,.08);
  --cl-in:inset 5px 5px 12px rgba(255,255,255,.07),inset -8px -10px 18px rgba(0,0,0,.35);
  --cl-press:inset 5px 5px 12px rgba(0,0,0,.4),inset -4px -4px 10px rgba(255,255,255,.05)}
html.jpa-on body{background:var(--jx-page)!important}

/* ---------- sidebar ---------- */
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > div:has(> [role="tablist"]) > [role="tablist"]{
  padding:16px 12px 18px;gap:5px;border:0;border-radius:var(--cl-r);background:var(--jx-side);box-shadow:var(--cl-out),var(--cl-in)}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > div:has(> [role="tablist"]) > [role="tablist"]::before{
  border-bottom:0;margin:0 0 8px;padding:10px 14px;border-radius:16px;background:var(--jx-card-2);box-shadow:var(--cl-press);color:var(--jx-accent-text)}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > div:has(> [role="tablist"]) > [role="tablist"] > [role="tab"]{
  height:42px;padding:0 12px;border-radius:16px;font-weight:600;color:var(--jx-muted);
  transition:background-color .25s,color .25s,box-shadow .3s,transform .3s cubic-bezier(.34,1.56,.64,1)}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > div:has(> [role="tablist"]) > [role="tablist"] > [role="tab"]:hover{
  background:var(--jx-card-2);color:var(--jx-text);transform:translateX(3px)}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > div:has(> [role="tablist"]) > [role="tablist"] > [role="tab"][aria-selected="true"]{
  color:#fff;font-weight:700;background:linear-gradient(140deg,#A78BFA 0%,#8B5CF6 45%,#EC4899 100%);
  box-shadow:8px 10px 20px -6px rgba(139,92,246,.55),inset 4px 4px 8px rgba(255,255,255,.35),inset -5px -6px 12px rgba(80,20,140,.35)}

/* ---------- page heading ---------- */
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > h1[data-testid="admin-title"]{letter-spacing:-.03em}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > h1[data-testid="admin-title"]::before{
  padding:6px 12px;border-radius:999px;background:var(--jx-card);box-shadow:var(--cl-out),var(--cl-in);margin-bottom:12px;display:table}

/* ---------- KPI cards ---------- */
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid{gap:20px}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid > [data-slot="card"]{
  --cl-tint:#8B5CF6;border:0!important;border-radius:var(--cl-r)!important;overflow:visible;background:var(--jx-card)!important;
  box-shadow:var(--cl-out),var(--cl-in)!important;transition:transform .45s cubic-bezier(.34,1.56,.64,1),box-shadow .35s}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid > [data-slot="card"]::before{display:none!important}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid > [data-slot="card"]:hover{transform:translateY(-6px) scale(1.015)}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid > [data-slot="card"]:nth-child(1){--cl-tint:#8B5CF6;--cl-tint2:#C4B5FD}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid > [data-slot="card"]:nth-child(2){--cl-tint:#EC4899;--cl-tint2:#F9A8D4}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid > [data-slot="card"]:nth-child(3){--cl-tint:#F59E0B;--cl-tint2:#FCD34D}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid > [data-slot="card"]:nth-child(4){--cl-tint:#06B6D4;--cl-tint2:#67E8F9}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid > [data-slot="card"]:nth-child(5){--cl-tint:#10B981;--cl-tint2:#6EE7B7}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid > [data-slot="card"]:nth-child(6){--cl-tint:#6366F1;--cl-tint2:#A5B4FC}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid > [data-slot="card"] [data-slot="card-content"] > span:first-child{
  width:48px!important;height:48px!important;border-radius:17px!important;border:0!important;color:#fff!important;
  background:linear-gradient(145deg,var(--cl-tint2),var(--cl-tint))!important;
  box-shadow:6px 8px 16px -4px color-mix(in oklab,var(--cl-tint) 60%,transparent),inset 3px 3px 6px rgba(255,255,255,.5),inset -4px -5px 8px rgba(0,0,0,.18)!important;
  transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid > [data-slot="card"]:hover [data-slot="card-content"] > span:first-child{transform:rotate(-8deg) scale(1.08)}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid > [data-slot="card"] [data-slot="card-content"] > span:first-child svg{color:#fff!important}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > .grid > [data-slot="card"] [data-slot="card-content"] > div > p.font-heading{font-size:22px!important;color:var(--jx-text)}

/* ---------- alerts ---------- */
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > [data-testid="admin-low-stock-alert"],
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > [data-testid="admin-verify-alert"]{
  border:0!important;border-radius:var(--cl-r)!important;background:color-mix(in oklab,#F59E0B 12%,var(--jx-card))!important;box-shadow:var(--cl-out),var(--cl-in)!important}

/* ---------- panels, tables, inputs ---------- */
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > div:has(> [role="tablist"]) > [role="tabpanel"] [data-slot="card"]{
  border:0;border-radius:var(--cl-r);background:var(--jx-card);box-shadow:var(--cl-out),var(--cl-in)}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > div:has(> [role="tablist"]) > [role="tabpanel"] [data-slot="card"] [data-slot="card"]{
  border-radius:20px;background:var(--jx-card-2);box-shadow:var(--cl-press)}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > div:has(> [role="tablist"]) > [role="tabpanel"] thead[data-slot="table-header"] tr{background:transparent}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) > div:has(> [role="tablist"]) > [role="tabpanel"] tbody[data-slot="table-body"] tr:hover{background:var(--jx-row-hover)}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) input:not([type=checkbox]):not([type=radio]):not([type=file]),
html.jpa-on body div:has(> h1[data-testid="admin-title"]) textarea,
html.jpa-on body div:has(> h1[data-testid="admin-title"]) [data-slot="select-trigger"]{
  border:0!important;border-radius:16px!important;background:var(--jx-card-2)!important;box-shadow:var(--cl-press)!important;min-height:40px}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) input:focus,html.jpa-on body div:has(> h1[data-testid="admin-title"]) textarea:focus,
html.jpa-on body div:has(> h1[data-testid="admin-title"]) [data-slot="select-trigger"]:focus-visible{
  box-shadow:var(--cl-press),0 0 0 3px var(--jx-accent-line)!important}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) [role="tabpanel"] button[data-slot="button"]{border-radius:14px!important;transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) [role="tabpanel"] button[data-slot="button"]:hover{transform:translateY(-2px)}
html.jpa-on body div:has(> h1[data-testid="admin-title"]) [role="tabpanel"] button[data-slot="button"].btn-gradient{
  background-image:linear-gradient(140deg,#A78BFA,#8B5CF6 50%,#EC4899)!important;
  box-shadow:6px 8px 16px -6px rgba(139,92,246,.6),inset 3px 3px 6px rgba(255,255,255,.35),inset -4px -4px 8px rgba(80,20,140,.3)!important}