/* ═══════════════════════════════════════════════════════════════════
   PP STAMP — Dashboard Modern Theme v1.6.26
   ─ ไฟล์นี้ self-hosted 100% ไม่พึ่ง CDN ภายนอก
   ─ ทุก selector ครอบใต้ .pp-dash เท่านั้น → ไม่กระทบเมนู/หน้าอื่นแม้แต่จุดเดียว
   ─ ดีไซน์: การ์ดกระจกฝ้า (frosted glass) กลืนกับ wallpaper ทุกธีม
     (อวกาศ/มหาสมุทร/ซากุระ/ป่าหมอก/ฯลฯ) + ตัวเลขแบบ tabular + แสงออโรร่าที่ hero
   ═══════════════════════════════════════════════════════════════════ */

/* ── ตัวเลขสถิติ: ความกว้างเท่ากันทุกหลัก อ่านง่าย ดูพรีเมียม ── */
.pp-dash .font-black{
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.015em;
}

/* ── การ์ดพื้นขาว → กระจกฝ้าโปร่งแสง ── */
.pp-dash .bg-white{
  background: rgba(255,255,255,.78) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.35);
  backdrop-filter: blur(16px) saturate(1.35);
  border-color: rgba(255,255,255,.55) !important;
  box-shadow: 0 10px 30px -14px rgba(2,6,23,.30),
              inset 0 1px 0 rgba(255,255,255,.60);
}
.pp-dash .bg-slate-50,
.pp-dash .bg-gray-50{
  background: rgba(248,250,252,.62) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.25);
  backdrop-filter: blur(12px) saturate(1.25);
}

/* กล่องกำไรสุทธิ (โทนเขียว) และกล่องแจ้งเตือน (เหลือง/แดง) → กระจกติดสี */
.pp-dash .from-emerald-50{
  background: linear-gradient(135deg, rgba(209,250,229,.72), rgba(255,255,255,.66)) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.3);
  backdrop-filter: blur(14px) saturate(1.3);
  border-color: rgba(110,231,183,.55) !important;
  box-shadow: 0 12px 32px -16px rgba(5,150,105,.35);
}
.pp-dash .bg-amber-50{
  background: rgba(255,251,235,.72) !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.pp-dash .bg-red-50{
  background: rgba(254,242,242,.72) !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

/* ── มุมโค้ง + เส้นขอบ ให้เนียนสม่ำเสมอทั้งหน้า ── */
.pp-dash .rounded-2xl{ border-radius: 20px; }
.pp-dash .rounded-3xl{ border-radius: 26px; }
.pp-dash .border-gray-100{ border-color: rgba(255,255,255,.45) !important; }

/* ── การ์ดหลัก: ยกตัวนุ่ม ๆ ตอนชี้ (เฉพาะกล่อง section ที่มี padding ใหญ่) ── */
.pp-dash :where(.p-4, .border-2){
  transition: transform .22s cubic-bezier(.22,1,.36,1), box-shadow .22s ease;
}
.pp-dash :where(.p-4, .border-2):hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 40px -18px rgba(2,6,23,.38),
              inset 0 1px 0 rgba(255,255,255,.65);
}

/* ── KPI แถบบน (ยอดขาย/ทุน/กำไร ไล่เฉดสี): เพิ่มขอบแสง + ไฮไลต์ในตัว ── */
.pp-dash [class*="from-emerald-500"],
.pp-dash [class*="from-orange-400"],
.pp-dash [class*="from-amber-400"],
.pp-dash [class*="from-sky-500"],
.pp-dash [class*="from-cyan-500"],
.pp-dash [class*="from-teal-500"],
.pp-dash [class*="from-blue-500"]{
  border: 1px solid rgba(255,255,255,.28);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35),
              0 14px 30px -14px rgba(2,6,23,.45);
}

/* ── ลายเซ็นของหน้า: แสงออโรร่าลอยช้า ๆ บน hero สีเข้ม ── */
.pp-dash .from-slate-900{
  border: 1px solid rgba(148,163,184,.28);
  isolation: isolate;
}
.pp-dash .from-slate-900::before{
  content: "";
  position: absolute;
  inset: -40%;
  z-index: -1;
  background:
    radial-gradient(38% 55% at 22% 30%, rgba(45,212,191,.34), transparent 62%),
    radial-gradient(30% 45% at 78% 65%, rgba(96,165,250,.28), transparent 60%),
    radial-gradient(24% 40% at 55% 15%, rgba(167,139,250,.20), transparent 58%);
  filter: blur(34px);
  animation: pp-aurora 16s ease-in-out infinite alternate;
  pointer-events: none;
}
@keyframes pp-aurora{
  0%   { transform: translate3d(-6%, -4%, 0) rotate(0.001deg); }
  100% { transform: translate3d(6%, 5%, 0) rotate(0.001deg); }
}

/* ── กราฟแท่ง: อิ่มสีขึ้นนิด + ปลายโค้งเรียบ ── */
.pp-dash .rounded-t{
  border-radius: 6px 6px 0 0;
  filter: saturate(1.15);
}

/* ── แถวรายการ (ทีมทำอะไรวันนี้ ฯลฯ): เส้นคั่นบางลง โปร่งขึ้น ── */
.pp-dash .divide-y > *{ border-color: rgba(148,163,184,.18) !important; }

/* ── เคารพผู้ใช้ที่ปิดแอนิเมชันในระบบ ── */
@media (prefers-reduced-motion: reduce){
  .pp-dash .from-slate-900::before{ animation: none; }
  .pp-dash :where(.p-4, .border-2),
  .pp-dash :where(.p-4, .border-2):hover{ transition: none; transform: none; }
}

/* ── v1.6.28: Loss Center polish ── */
.pp-loss .shadow-sm{ box-shadow: 0 2px 12px -4px rgba(15,23,42,.10), 0 1px 3px -1px rgba(15,23,42,.06); }
.pp-loss .shadow-lg{ box-shadow: 0 12px 28px -12px rgba(15,23,42,.35); }
.pp-loss input:focus, .pp-loss select:focus, .pp-loss textarea:focus{
  outline: none; border-color: rgba(244,63,94,.55);
  box-shadow: 0 0 0 3px rgba(244,63,94,.10);
}
.pp-loss table tbody tr:hover{ background: rgba(248,250,252,.7); }

/* v1.6.56: utilities used by the injected Loss Center but absent from the purged production bundle */
.pp-dash .bg-slate-200{ background-color:#e2e8f0; }
.pp-dash .text-slate-300{ color:#cbd5e1; }
.pp-dash .text-\[13px\]{ font-size:13px; }
.pp-dash .-top-4{ top:-1rem; }
.pp-dash .-top-5{ top:-1.25rem; }
.pp-dash .-right-3{ right:-.75rem; }
.pp-dash .-right-4{ right:-1rem; }
.pp-dash .mr-2{ margin-right:.5rem; }
.pp-dash .h-36{ height:9rem; }
.pp-dash .opacity-0{ opacity:0; }
.pp-dash .group:hover .group-hover\:opacity-100{ opacity:1; }
.pp-dash .rounded-t-lg{ border-top-left-radius:.5rem; border-top-right-radius:.5rem; }
.pp-dash .bg-gradient-to-t{ background-image:linear-gradient(to top,var(--tw-gradient-stops)); }
.pp-dash .border-slate-50{ border-color:#f8fafc; }
.pp-dash .min-w-\[200px\]{ min-width:200px; }
.pp-dash .gap-x-4{ column-gap:1rem; }
.pp-dash .gap-y-1{ row-gap:.25rem; }
.pp-dash .max-w-xl{ max-width:36rem; }
.pp-dash .from-rose-400{ --tw-gradient-from:#fb7185 var(--tw-gradient-from-position); --tw-gradient-to:rgb(251 113 133 / 0) var(--tw-gradient-to-position); --tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to); }
.pp-dash .to-orange-400{ --tw-gradient-to:#fb923c var(--tw-gradient-to-position); }
.pp-dash .to-orange-500{ --tw-gradient-to:#f97316 var(--tw-gradient-to-position); }
.pp-dash .from-slate-700{ --tw-gradient-from:#334155 var(--tw-gradient-from-position); --tw-gradient-to:rgb(51 65 85 / 0) var(--tw-gradient-to-position); --tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to); }
.pp-dash .to-slate-900{ --tw-gradient-to:#0f172a var(--tw-gradient-to-position); }
.pp-dash .from-emerald-400{ --tw-gradient-from:#34d399 var(--tw-gradient-from-position); --tw-gradient-to:rgb(52 211 153 / 0) var(--tw-gradient-to-position); --tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to); }
.pp-dash .hover\:from-rose-600:hover{ --tw-gradient-from:#e11d48 var(--tw-gradient-from-position); --tw-gradient-to:rgb(225 29 72 / 0) var(--tw-gradient-to-position); --tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to); }

/* v1.6.56: utilities used by the injected Supplier Return/CN module */
.pp-dash .rounded-\[24px\]{border-radius:24px}
.pp-dash .rounded-\[28px\]{border-radius:28px}
.pp-dash .min-h-\[74px\]{min-height:74px}
.pp-dash .min-w-\[180px\]{min-width:180px}
.pp-dash .min-w-\[260px\]{min-width:260px}
.pp-dash .max-w-\[360px\]{max-width:360px}
.pp-dash .w-28{width:7rem}
.pp-dash .mr-auto{margin-right:auto}
.pp-dash .text-slate-900{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity))}
.pp-dash .tracking-\[0\.25em\]{letter-spacing:.25em}
.pp-dash .divide-slate-100>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(241 245 249/var(--tw-divide-opacity))}
.pp-dash .via-teal-900{--tw-gradient-to:rgb(19 78 74/0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),#134e4a var(--tw-gradient-via-position),var(--tw-gradient-to)}
.pp-dash .to-red-500{--tw-gradient-to:#ef4444 var(--tw-gradient-to-position)}
/* v1.6.56: additional utilities for analytics widgets */
.pp-dash .basis-full{flex-basis:100%}
.pp-dash .my-5{margin-top:1.25rem;margin-bottom:1.25rem}
.pp-dash .pr-3{padding-right:.75rem}
.pp-dash .pl-3{padding-left:.75rem}
.pp-dash .bg-rose-400{--tw-bg-opacity:1;background-color:rgb(251 113 133 / var(--tw-bg-opacity,1))}
.pp-dash .to-rose-400{--tw-gradient-to:#fb7185 var(--tw-gradient-to-position)}
.pp-dash .to-orange-50\/50{--tw-gradient-to:rgb(255 247 237 / .5) var(--tw-gradient-to-position)}
