/* ============================================================================
   g9s-pages.css — Gebezy WMS · ธีมสำหรับหน้าเนื้อหา (dashboard / report / ฯลฯ)

   วางไฟล์ที่ :  public/assets/css/g9s-pages.css
   เรียกใช้จาก :  application/admin/view/common/meta.html
                 (บรรทัดถัดจาก g9s-theme.css)

   *** ไม่ต้องแก้ dashboard.html ***
   ทุกกฎในไฟล์นี้ขึ้นต้นด้วย `body ` เพื่อให้ specificity สูงกว่า <style>
   ที่ฝังอยู่ในหน้านั้น (0,1,1 ชนะ 0,1,0) จึงทับได้โดยไม่ต้องใช้ !important

   ไฟล์นี้ครอบทุกหน้าที่ใช้คลาสตระกูล .g9s-* — เพิ่มหน้าใหม่ก็ได้ธีมทันที
   ============================================================================ */

/* ============================================================
   1. พื้นหลังหน้า
   ============================================================ */
body .g9s-dashboard,
html body{
  background:#f2f0ea;
}
body{
  font-family:"Anuphan", -apple-system, "Segoe UI", sans-serif;
  color:#1f2937;
}

/* ============================================================
   2. Hero — เดิมเป็นไล่เฉดน้ำเงิน #2563eb
      เปลี่ยนเป็นกรมท่า + แสงทอง ให้ตรงกับ login / sidebar
   ============================================================ */
body .g9s-hero{
  background:
    radial-gradient(900px 460px at 88% -20%, rgba(210,162,76,.22), transparent 62%),
    linear-gradient(135deg, #0b1420 0%, #182a40 55%, #22364f 100%);
  border-radius:16px;
  box-shadow:0 2px 4px rgba(3,8,15,.2), 0 24px 60px rgba(11,20,32,.22);
  border:1px solid rgba(210,162,76,.16);
}
/* วงกลมจาง ๆ สองวง → เปลี่ยนเป็นเส้นขอบทองบาง ๆ ดูตั้งใจกว่า */
body .g9s-hero:before{
  right:-110px;
  top:-110px;
  width:280px;
  height:280px;
  background:transparent;
  border:1px solid rgba(210,162,76,.18);
}
body .g9s-hero:after{
  right:90px;
  bottom:-130px;
  width:220px;
  height:220px;
  background:transparent;
  border:1px solid rgba(210,162,76,.1);
}

body .g9s-hero-title{
  font-family:"Prompt", sans-serif;
  font-weight:600;
  font-size:28px;
  letter-spacing:-.2px;
}
body .g9s-hero-desc{
  color:rgba(236,238,242,.68);
  font-size:14px;
}

/* กล่อง "คลังที่เลือก" — เป็นบริบทสำคัญ ให้มีขอบทอง */
body .g9s-hero-warehouse{
  background:rgba(210,162,76,.1);
  border:1px solid rgba(210,162,76,.34);
  border-radius:12px;
}
body .g9s-hero-warehouse-label{
  font-family:"IBM Plex Mono", monospace;
  font-size:9.5px;
  letter-spacing:1.8px;
  text-transform:uppercase;
  color:rgba(236,202,138,.75);
}
body .g9s-hero-warehouse-value{
  font-family:"Prompt", sans-serif;
  font-weight:600;
  font-size:16px;
  color:#ecca8a;
}

/* สถิติ 4 ช่องบน hero */
body .g9s-top-stat{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.09);
  border-radius:12px;
  transition:border-color .2s ease, background .2s ease;
}
body .g9s-top-stat:hover{
  border-color:rgba(210,162,76,.35);
  background:rgba(255,255,255,.08);
}
body .g9s-top-stat-label{
  font-family:"IBM Plex Mono", monospace;
  font-size:9.5px;
  letter-spacing:1.6px;
  text-transform:uppercase;
  color:rgba(236,238,242,.55);
}
/* ตัวเลขใช้ mono — เรียงหลักตรงกัน อ่านง่ายกว่าฟอนต์ปกติ */
body .g9s-top-stat-value{
  font-family:"IBM Plex Mono", monospace;
  font-weight:600;
  font-size:29px;
  color:#fff;
}
body .g9s-top-stat-sub{
  color:rgba(236,238,242,.55);
  font-size:11.5px;
}

/* ============================================================
   3. การ์ดขาว
   ============================================================ */
body .g9s-card,
body .g9s-health-item,
body .g9s-kpi-item,
body .g9s-snapshot-item{
  background:#fff;
  border:1px solid #e8e3d7;
  border-radius:14px;
  box-shadow:0 1px 2px rgba(11,20,32,.04);
}
body .g9s-health-item,
body .g9s-kpi-item{
  transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
body .g9s-health-item:hover,
body .g9s-kpi-item:hover{
  border-color:rgba(210,162,76,.5);
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(11,20,32,.08);
}

body .g9s-card-title{
  font-family:"Prompt", sans-serif;
  font-weight:600;
  font-size:17px;
  color:#0b1420;
}
body .g9s-card-desc{
  color:#66717e;
  font-size:12px;
}
body .g9s-chart-wrap{
  background:#f7f5f0;
  border:1px solid #f1eee6;
  border-radius:12px;
}

/* ============================================================
   4. Operation Summary — ไอคอน 4 สี
      เดิม: ฟ้า / ม่วง / ส้ม / แดง  = สุ่มมา ไม่มีความหมาย
      ใหม่: สีบอกทิศทางของสินค้าจริง ๆ
        ทอง   = ขาเข้า (GR)
        กรมท่า = ขาออก (GI)
        เหลืองอำพัน = โอนย้าย (ยังอยู่ในคลัง)
        แดง   = ปรับปรุง (ยอดไม่ตรง ต้องมีคนดู)
   ============================================================ */
body .g9s-doc-item{
  background:#f7f5f0;
  border:1px solid #f1eee6;
  border-radius:12px;
  transition:border-color .18s ease, background .18s ease;
}
body .g9s-doc-item:hover{
  background:#faf3e6;
  border-color:rgba(210,162,76,.35);
}
body .g9s-doc-icon{
  width:42px;
  height:42px;
  flex:0 0 42px;
  border-radius:11px;
  font-size:16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28);
}
body .g9s-bg-blue{                 /* Goods Receipt — ขาเข้า */
  background:linear-gradient(135deg, #ecca8a, #d2a24c 55%, #a2762e);
  color:#0b1420;
}
body .g9s-bg-violet{               /* Goods Issue — ขาออก */
  background:linear-gradient(135deg, #22364f, #0b1420);
  color:#ecca8a;
}
body .g9s-bg-orange{               /* Transfer — ย้ายภายใน */
  background:linear-gradient(135deg, #e0b567, #a2762e);
  color:#0b1420;
}
body .g9s-bg-red{                  /* Adjustment — ยอดเพี้ยน */
  background:linear-gradient(135deg, #d05a4c, #c0392b);
  color:#fff;
}

body .g9s-doc-title{
  font-family:"Prompt", sans-serif;
  font-weight:600;
  font-size:14px;
  color:#0b1420;
}
body .g9s-doc-sub{ color:#66717e; font-size:11.5px; }
body .g9s-doc-num{
  font-family:"IBM Plex Mono", monospace;
  font-weight:600;
  font-size:23px;
  color:#0b1420;
}
/* "ค้าง N" — เดิมแดงเสมอ แม้ค้าง 0 ซึ่งไม่ใช่เรื่องผิดปกติ
   เปลี่ยนเป็นสีเตือน (อำพัน) แดงเก็บไว้ให้ error จริง ๆ */
body .g9s-doc-pending{
  font-family:"IBM Plex Mono", monospace;
  font-size:11px;
  letter-spacing:.5px;
  color:#8a5d0b;
  background:#fdf3e2;
  border:1px solid rgba(217,148,34,.28);
  border-radius:99px;
  padding:1px 9px;
  display:inline-block;
}

/* ============================================================
   5. Health / KPI
   ============================================================ */
body .g9s-health-icon{
  width:42px;
  height:42px;
  border-radius:11px;
  font-size:16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28);
}
body .g9s-health-name,
body .g9s-kpi-name{
  font-family:"IBM Plex Mono", monospace;
  font-size:9.5px;
  letter-spacing:1.6px;
  text-transform:uppercase;
  color:#a2762e;
}
body .g9s-health-value,
body .g9s-kpi-value{
  font-family:"IBM Plex Mono", monospace;
  font-weight:600;
  font-size:29px;
  color:#0b1420;
}
body .g9s-health-note,
body .g9s-kpi-note{
  color:#8b8578;
  font-size:11.5px;
}

/* KPI ที่เป็นเปอร์เซ็นต์: 100% = ผ่าน → เขียวได้ (นี่คือ "สถานะสำเร็จ" ตัวจริง)
   ต้องมีคลาสช่วย ดูวิธีใช้ท้ายไฟล์ — ถ้าไม่ใส่ ก็เป็นสีดำปกติ */
body .g9s-kpi-item.is-ok .g9s-kpi-value{ color:#1e7a50; }
body .g9s-kpi-item.is-warn .g9s-kpi-value{ color:#8a5d0b; }
body .g9s-kpi-item.is-bad .g9s-kpi-value{ color:#c0392b; }

/* ============================================================
   6. Snapshot 3 ใบล่าง
      *** จุดที่ผิดกฎ 60/40 ชัดที่สุด ***
      เดิม "งานค้างรวม" เป็นสีเขียว — งานค้าง ไม่ใช่ความสำเร็จ
      คนอ่านผ่าน ๆ จะนึกว่าทุกอย่างเรียบร้อย ทั้งที่มันคือของที่ยังไม่เสร็จ
   ============================================================ */
body .g9s-snapshot-item{
  border-radius:14px;
  min-height:150px;
}
body .g9s-snapshot-name{
  font-family:"IBM Plex Mono", monospace;
  font-size:9.5px;
  letter-spacing:1.6px;
  text-transform:uppercase;
}
body .g9s-snapshot-value{
  font-family:"IBM Plex Mono", monospace;
  font-weight:600;
  font-size:30px;
}
body .g9s-snapshot-note{ font-size:11.5px; }

/* เอกสารวันนี้ = ปริมาณงาน → ทอง (สีแบรนด์) */
body .g9s-snapshot-item.blue{
  background:linear-gradient(135deg, #ecca8a, #d2a24c 55%, #a2762e);
  border-color:transparent;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 10px 26px rgba(162,118,46,.25);
}
body .g9s-snapshot-item.blue .g9s-snapshot-name{ color:rgba(11,20,32,.62); }
body .g9s-snapshot-item.blue .g9s-snapshot-value{ color:#0b1420; }
body .g9s-snapshot-item.blue .g9s-snapshot-note{ color:rgba(11,20,32,.72); }

/* งานค้างรวม = ยังไม่เสร็จ → สีเตือน ไม่ใช่เขียว */
body .g9s-snapshot-item.green{
  background:linear-gradient(135deg, #e8a83a, #b87a12);
  border-color:transparent;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 10px 26px rgba(184,122,18,.25);
}
body .g9s-snapshot-item.green .g9s-snapshot-name{ color:rgba(255,255,255,.8); }
body .g9s-snapshot-item.green .g9s-snapshot-value{ color:#fff; }
body .g9s-snapshot-item.green .g9s-snapshot-note{ color:rgba(255,255,255,.85); }

/* คลังที่กำลังใช้งาน = บริบท → กรมท่า + ขอบทอง */
body .g9s-snapshot-item.dark{
  background:linear-gradient(135deg, #182a40, #0b1420);
  border:1px solid rgba(210,162,76,.3);
}
body .g9s-snapshot-item.dark .g9s-snapshot-name{ color:rgba(236,202,138,.72); }
body .g9s-snapshot-item.dark .g9s-snapshot-value{ color:#ecca8a; }
body .g9s-snapshot-item.dark .g9s-snapshot-note{ color:rgba(236,238,242,.6); }

/* ถ้าอยากได้สีเขียวจริง ๆ เมื่อ "งานค้าง = 0" (ซึ่งแปลว่าสำเร็จ)
   ให้ฝั่ง PHP เติมคลาส is-clear เข้าไป:
   <div class="g9s-snapshot-item green {if $dashboard.pendingDocs == 0}is-clear{/if}"> */
body .g9s-snapshot-item.green.is-clear{
  background:linear-gradient(135deg, #35c184, #1e7a50);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 10px 26px rgba(30,122,80,.25);
}

/* ============================================================
   7. panel-intro ของ FastAdmin บนหน้านี้
   ============================================================ */
body .panel.panel-default.panel-intro{
  background:transparent;
  border:0;
  box-shadow:none;
}
body .panel.panel-default.panel-intro > .panel-heading{
  background:transparent;
  border:0;
}

/* ============================================================
   8. Responsive
   ============================================================ */
@media (max-width:767px){
  body .g9s-hero-title{ font-size:23px; }
  body .g9s-top-stat-value,
  body .g9s-health-value,
  body .g9s-kpi-value,
  body .g9s-snapshot-value{ font-size:25px; }
}

@media (prefers-reduced-motion: reduce){
  body .g9s-top-stat,
  body .g9s-health-item,
  body .g9s-kpi-item,
  body .g9s-doc-item{ transition:none; }
}

/* หมายเหตุ: ส่วน Element UI (ปุ่ม ตาราง dialog แท็บ)
   ย้ายไปแก้ที่ต้นทางใน common.css แล้ว จึงไม่ต้องมีในไฟล์นี้ */