/* =====================================================================
   PW Workplus mini-ERP — Odoo-inspired shared theme
   โหลดไฟล์นี้ "หลัง" <style> ของแต่ละหน้า เพื่อ override สีหลัก (--primary)
   + เพิ่มแถบเมนูบน (.pw-top) ที่ฉีดด้วย pw_shell.js
   ===================================================================== */

/* ---- override โทนสีให้เป็นม่วงแบบ Odoo (aubergine) ---- */
:root{
  --primary:#714B67;          /* Odoo brand purple */
  --primary-soft:#f4eef2;     /* tint อ่อนสำหรับ focus/badge/note */
}

/* ฟอนต์คมขึ้นเล็กน้อย */
body{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }

/* ---- Odoo control panel: เปลี่ยน hero band ใหญ่ → แถบสีขาวบาง ---- */
header{
  background:#fff !important;
  color:var(--ink) !important;
  border:1px solid var(--line) !important;
  border-radius:10px !important;
  box-shadow:var(--shadow) !important;
  padding:14px 20px !important;
}
header h1{ font-size:18px !important; font-weight:700 !important; }
header .sub{ color:var(--muted) !important; opacity:1 !important; }
header .sub b{ color:var(--ink) !important; }
header .sub code{ background:var(--primary-soft) !important; color:var(--primary) !important; }
/* date control บน control panel ขาว (หน้า สรุปยอดรายวัน) */
header .datebox{ background:var(--primary-soft) !important; }
header .datebox label{ color:var(--primary) !important; opacity:1 !important; }
header .datebox .th{ color:var(--ink) !important; }
/* badge บน control panel (หน้า แดชบอร์ดจ่ายเงิน) */
header .badge{ background:var(--primary-soft) !important; border:1px solid #e6d8e2 !important; color:var(--primary) !important; }

/* ---- control panel เต็มความกว้าง (ฉีด/ย้าย header โดย pw_shell.js) ---- */
.pw-cp{ position:sticky; top:48px; z-index:100; background:#fff; border-bottom:1px solid var(--line); box-shadow:0 2px 5px rgba(0,0,0,.04); }
.pw-cp-in{ margin:0 auto; }
.pw-cp header{ background:transparent !important; border:none !important; border-radius:0 !important; box-shadow:none !important; padding:13px 0 !important; margin:0 !important; }

/* ---- ตารางแบบ list view (Odoo): หัวเทาอ่อน + hover ม่วง ---- */
thead th{ background:#faf7fa; }
tbody tr:hover{ background:#f7f3f6; }

/* ---- การ์ดคมแบบ Odoo + ปุ่มมุมเล็กลง ---- */
section{ border:1px solid var(--line); }
.btn, .btn.add, .btn.save, .btn.ghost, .addbtn, .save{ border-radius:6px !important; }
.btn.add:hover{ background:#5d3d55 !important; }

/* =====================================================================
   แถบเมนูบน (Top app bar) — สไตล์ ERP
   ===================================================================== */
.pw-top{
  position:sticky; top:0; z-index:200;
  display:flex; align-items:center; gap:14px;
  height:48px; padding:0 16px;
  background:linear-gradient(90deg,#1f3a5f,#2e567f);   /* NetSuite navy */
  color:#fff; box-shadow:0 1px 8px rgba(0,0,0,.18);
  font-family:"Segoe UI","Sarabun",-apple-system,sans-serif;
}
.pw-top .brand{
  display:flex; align-items:center; gap:8px;
  font-weight:800; font-size:15px; color:#fff; text-decoration:none; white-space:nowrap;
}
.pw-top .brand .logo{
  width:27px; height:27px; border-radius:7px; background:rgba(255,255,255,.18);
  display:flex; align-items:center; justify-content:center; font-size:15px;
}
.pw-top .crumb{
  font-size:14px; font-weight:600; opacity:.95;
  padding-left:14px; border-left:1px solid rgba(255,255,255,.28); white-space:nowrap;
}
.pw-top .spacer{ flex:1; }
.pw-top .apps{ display:flex; gap:3px; overflow-x:auto; max-width:54vw; }
.pw-top .apps::-webkit-scrollbar{ height:0; }
.pw-top .apps a{
  display:flex; align-items:center; gap:6px;
  color:rgba(255,255,255,.85); text-decoration:none;
  font-size:13px; font-weight:600; padding:6px 11px; border-radius:7px; white-space:nowrap;
}
.pw-top .apps a:hover{ background:rgba(255,255,255,.13); color:#fff; }
.pw-top .apps a.active{ background:rgba(255,255,255,.22); color:#fff; }
.pw-top .apps .div{ width:1px; height:18px; align-self:center; background:rgba(255,255,255,.28); margin:0 4px; flex:0 0 auto; }
.pw-top .apps a .ic{ font-size:15px; display:flex; align-items:center; }
.pw-top .apps a .ic svg{ width:16px; height:16px; display:block; }
.pw-top .brand .logo svg{ width:17px; height:17px; display:block; }
.pw-top .user{ display:flex; align-items:center; gap:9px; font-size:13px; white-space:nowrap; }
.pw-top .user .av{
  width:29px; height:29px; border-radius:50%; background:rgba(255,255,255,.22);
  display:flex; align-items:center; justify-content:center; font-weight:800;
}
.pw-top .user .out{ color:#fff; text-decoration:none; opacity:.8; font-size:17px; }
.pw-top .user .out:hover{ opacity:1; }

@media(max-width:860px){
  .pw-top .crumb{ display:none; }
  .pw-top .apps a .tx{ display:none; }       /* เหลือไอคอนอย่างเดียว */
  .pw-top .apps{ max-width:none; }
  .pw-top .user .nm{ display:none; }
}