/* ═══════════════════════════════════════════════════════════
   PP Account · Modern Theme (v21.24.29)
   โหลดทับ style เดิม — ถ้าไม่ชอบ ลบบรรทัด <link> ของไฟล์นี้ใน index.php
   ก็กลับไปหน้าตาเดิมได้ทันที ไม่กระทบการทำงานใด ๆ
   แนวคิด: พื้นผิวโปร่ง (glass) · เงานุ่ม · ไอคอนประจำเมนู · ขยับตอน hover
   ═══════════════════════════════════════════════════════════ */

:root{
  --mt-ease:cubic-bezier(.22,1,.36,1);
  --mt-radius:14px;
  --mt-shadow-sm:0 1px 2px rgba(24,37,31,.06),0 2px 8px rgba(24,37,31,.05);
  --mt-shadow-md:0 4px 12px rgba(24,37,31,.08),0 12px 32px rgba(24,37,31,.07);
  --mt-shadow-lg:0 8px 24px rgba(24,37,31,.10),0 24px 64px rgba(24,37,31,.10);
  --mt-glass:rgba(255,253,248,.72);
  --mt-accent:#1f6b4f;
  --mt-accent-soft:#eef7f2;
}

/* ── พื้นหลังไล่เฉดนุ่ม ── */
body{
  background:
    radial-gradient(1200px 600px at 12% -8%, #eaf3ee 0%, transparent 60%),
    radial-gradient(900px 500px at 96% 4%, #f6efe4 0%, transparent 55%),
    var(--paper,#f4f1e9);
  background-attachment:fixed;
}

/* ── แถบเมนูซ้าย: โทนเข้มเขียวลึก ให้เข้ากับการ์ดหัวแดชบอร์ด ──
   หมายเหตุ: ดีไซน์เดิมเป็นพื้นเข้ม + ตัวอักษรสีอ่อน (#abbab2)
   ห้ามเปลี่ยนพื้นเป็นสีอ่อนโดยไม่เปลี่ยนสีตัวอักษรตาม ไม่งั้นตัวหนังสือจะจมหายไป */
aside{
  background:linear-gradient(180deg,#16302690 0%,#102a2190 100%),
             linear-gradient(180deg,#173c30 0%,#0f2a21 100%)!important;
  color:#e9f2ec!important;
  border-right:1px solid rgba(255,255,255,.08)!important;
  box-shadow:inset -1px 0 0 rgba(0,0,0,.2);
}
aside .brand{border-bottom-color:rgba(255,255,255,.14)!important}
aside .brand i{border-color:rgba(255,255,255,.34)!important;color:#fff}
aside .brand small{color:#9fb8ab!important}
aside .note{color:#8fa89b!important}
aside nav{display:flex;flex-direction:column;gap:2px}

/* ── ปุ่มเมนู ── */
aside nav button{
  position:relative;
  display:flex!important;align-items:center;gap:12px;
  border-radius:10px!important;
  padding:11px 13px!important;
  min-height:44px;
  border:1px solid transparent!important;
  background:transparent!important;
  color:#cfe0d6!important;              /* คอนทราสต์ ~9:1 บนพื้นเข้ม อ่านสบาย */
  font-weight:500;
  letter-spacing:.1px;
  transition:transform .2s var(--mt-ease),background .2s var(--mt-ease),
             color .16s var(--mt-ease),box-shadow .2s var(--mt-ease);
}
aside nav button::before{
  content:"";flex:none;width:20px;height:20px;
  background:currentColor;opacity:.9;
  -webkit-mask:var(--mt-icon) center/19px 19px no-repeat;
  mask:var(--mt-icon) center/19px 19px no-repeat;
  transition:opacity .16s var(--mt-ease),transform .2s var(--mt-ease);
}
aside nav button:hover{
  background:rgba(255,255,255,.10)!important;
  color:#ffffff!important;
  transform:translateX(2px);
}
aside nav button:hover::before{transform:scale(1.08)}
aside nav button:focus-visible{
  outline:none;
  box-shadow:0 0 0 2px rgba(255,255,255,.55);
}

/* เมนูที่เลือกอยู่: เขียวสว่างตัดกับพื้นเข้มชัดเจน */
aside nav button.active{
  background:linear-gradient(135deg,#25805c,#1c6f50)!important;
  color:#ffffff!important;
  font-weight:700;
  box-shadow:0 4px 16px rgba(37,128,92,.42),inset 0 1px 0 rgba(255,255,255,.18);
  border-color:rgba(255,255,255,.14)!important;
}
aside nav button.active::before{opacity:1}
aside nav button:active{transform:translateX(2px) scale(.985)}
aside nav button.permissionHidden,aside nav button.hidden{display:none!important}

/* ตัวเลขแจ้งเตือนข้างเมนู (เช่น 16 / 40) */
aside nav button .badge,aside nav button [class*="badge"],aside nav button [class*="Badge"]{
  margin-left:auto;
  background:#bd4c36!important;color:#fff!important;
  border-radius:99px;padding:1px 8px;
  font-size:11px;font-weight:700;line-height:1.6;
  box-shadow:0 2px 6px rgba(189,76,54,.45);
}
aside nav button.active .badge,aside nav button.active [class*="badge"]{
  background:rgba(255,255,255,.92)!important;color:#1c5b43!important;
}

/* หัวข้อกลุ่มเมนู (ถ้ามี) */
aside nav .navGroupLabel,aside .navSection{
  color:#8fa89b!important;font-size:10px;font-weight:700;
  letter-spacing:1.2px;text-transform:uppercase;
  padding:16px 13px 6px;
}

/* ── ไอคอนประจำเมนู (SVG inline ไม่ต้องโหลดไฟล์เพิ่ม) ──
   ออกแบบใหม่: เลี่ยงรูปสี่เหลี่ยมล้วน ใช้เส้นโค้งที่สื่อความหมายเฉพาะเมนู
   stroke 1.7 + ปลายเส้นมน ให้ดูคมและเบาบนพื้นเข้ม

   สำคัญ: ถ้าเมนูใดไม่มี --mt-icon กำหนดไว้ mask จะว่าง
   ทำให้ ::before กลายเป็นสี่เหลี่ยมทึบ จึงซ่อนไอคอนเป็นค่าเริ่มต้น
   แล้วเปิดเฉพาะเมนูที่มีไอคอนจริงเท่านั้น */
aside nav button::before{display:none}
aside nav [data-view="dashboard"]::before,
aside nav [data-view="register"]::before,
aside nav [data-view="expenses"]::before,
aside nav [data-view="analytics"]::before,
aside nav [data-view="projects"]::before,
aside nav [data-view="chequeRegister"]::before,
aside nav [data-view="withholding"]::before,
aside nav [data-view="reconcile"]::before,
aside nav [data-view="creditCustomers"]::before,
aside nav [data-view="quickInfo"]::before,
aside nav [data-view="customers"]::before,
aside nav [data-view="myProfile"]::before,
aside nav [data-view="systemBackup"]::before,
aside nav [data-view="systemHealth"]::before,
aside nav [data-view="userAdmin"]::before{display:block}

aside nav [data-view="dashboard"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 14a9 9 0 0 1 18 0'/%3E%3Cpath d='M12 14l4.5-3.5'/%3E%3Cpath d='M3 14v3.4M21 14v3.4'/%3E%3C/svg%3E")}
aside nav [data-view="register"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v9'/%3E%3Cpath d='M8.5 8.5L12 12l3.5-3.5'/%3E%3Cpath d='M4 13v5a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-5'/%3E%3Cpath d='M4 13h4l1.2 2h5.6L16 13h4'/%3E%3C/svg%3E")}
aside nav [data-view="expenses"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h12v18l-2-1.4-2 1.4-2-1.4-2 1.4-2-1.4L6 21z'/%3E%3Cpath d='M9.5 8h5M9.5 12h5'/%3E%3C/svg%3E")}
aside nav [data-view="analytics"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 20V4'/%3E%3Cpath d='M3 20h18'/%3E%3Cpath d='M7 15l4-4.5 3 2.5L20.5 7'/%3E%3Cpath d='M20.5 7H17M20.5 7v3.4'/%3E%3C/svg%3E")}
aside nav [data-view="projects"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='16' height='17' rx='2.6'/%3E%3Cpath d='M8.5 2.6v3'/%3E%3Cpath d='M15.5 2.6v3'/%3E%3Cpath d='M8.4 12.4l2 2 4-4.2'/%3E%3Cpath d='M8.4 17.6h5'/%3E%3C/svg%3E")}
aside nav [data-view="chequeRegister"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 7.5h19a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1h-19a1 1 0 0 1-1-1v-7a1 1 0 0 1 1-1z'/%3E%3Cpath d='M5.5 13.4c1.2-2.2 2.2-2.2 3 0s1.8 2.2 3 0'/%3E%3Cpath d='M16 13.4h3.4'/%3E%3C/svg%3E")}
aside nav [data-view="withholding"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2.6H7a2 2 0 0 0-2 2v14.8a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7.6z'/%3E%3Cpath d='M14 2.6v5h5'/%3E%3Ccircle cx='10' cy='13' r='1.3'/%3E%3Ccircle cx='14.4' cy='17.2' r='1.3'/%3E%3Cpath d='M15 12l-6 6.4'/%3E%3C/svg%3E")}
aside nav [data-view="reconcile"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8h13.5'/%3E%3Cpath d='M14.5 4.6L18 8l-3.5 3.4'/%3E%3Cpath d='M20 16H6.5'/%3E%3Cpath d='M9.5 12.6L6 16l3.5 3.4'/%3E%3C/svg%3E")}
aside nav [data-view="creditCustomers"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='2.6'/%3E%3Cpath d='M2 9.5h20'/%3E%3Crect x='5.5' y='12.6' width='4' height='3' rx='.8'/%3E%3Cpath d='M14.6 14.6h4'/%3E%3C/svg%3E")}
aside nav [data-view="quickInfo"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2.5'/%3E%3Cpath d='M7 9h10M7 13h6M7 17h4'/%3E%3C/svg%3E")}
aside nav [data-view="customers"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9.5' cy='8' r='3.4'/%3E%3Cpath d='M3 20.5a6.5 6.5 0 0 1 13 0'/%3E%3Cpath d='M18.4 3.3l1.05 2.15 2.35.34-1.7 1.66.4 2.35-2.1-1.1-2.1 1.1.4-2.35-1.7-1.66 2.35-.34z'/%3E%3C/svg%3E")}
aside nav [data-view="myProfile"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9.2'/%3E%3Ccircle cx='12' cy='10' r='3.2'/%3E%3Cpath d='M5.9 19.2a6.6 6.6 0 0 1 12.2 0'/%3E%3C/svg%3E")}
aside nav [data-view="systemBackup"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='5.5' rx='7.5' ry='2.8'/%3E%3Cpath d='M4.5 5.5v6c0 1.5 3.3 2.8 7.5 2.8'/%3E%3Cpath d='M19.5 5.5v4.2'/%3E%3Cpath d='M14.6 18.4a3.9 3.9 0 1 0 1.15-2.75'/%3E%3Cpath d='M15.2 13.2v2.6h2.6'/%3E%3C/svg%3E")}
aside nav [data-view="systemHealth"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 12h4l2-5.2 3.4 10.4L15 12h6.5'/%3E%3C/svg%3E")}
aside nav [data-view="userAdmin"]{--mt-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.6l7.5 3v5.6c0 4.6-3.1 8.2-7.5 10.2-4.4-2-7.5-5.6-7.5-10.2V5.6z'/%3E%3Ccircle cx='12' cy='10' r='2.3'/%3E%3Cpath d='M8.5 16.3a4 4 0 0 1 7 0'/%3E%3C/svg%3E")}

/* ── การ์ด/แผง: ยกตัวเบา ๆ ตอน hover ── */
.panel,.rptBox,.metric,.dashMetric,.custCard,.meBox{
  border-radius:var(--mt-radius);
  box-shadow:var(--mt-shadow-sm);
  transition:transform .24s var(--mt-ease),box-shadow .24s var(--mt-ease);
}
.metric:hover,.dashMetric:hover,.custCard:hover{transform:translateY(-2px);box-shadow:var(--mt-shadow-md)}
.rptCards,.meGrid>.rptBox,.bankAutoMetrics{border-radius:var(--mt-radius);overflow:hidden}

/* ── ปุ่ม ── */
button,.rptActions button,.rcActions button{
  border-radius:9px;
  transition:transform .16s var(--mt-ease),box-shadow .16s var(--mt-ease),
             background .18s var(--mt-ease),border-color .18s var(--mt-ease);
}
button:hover:not(:disabled){transform:translateY(-1px);box-shadow:var(--mt-shadow-sm)}
button:active:not(:disabled){transform:translateY(0) scale(.98)}
button.primary,.primary{box-shadow:0 3px 10px rgba(31,107,79,.22)}
button.primary:hover:not(:disabled){box-shadow:0 6px 18px rgba(31,107,79,.3)}

/* ── ช่องกรอก ── */
input,select,textarea{
  border-radius:9px!important;
  transition:border-color .18s var(--mt-ease),box-shadow .18s var(--mt-ease),background .18s var(--mt-ease);
}
input:focus,select:focus,textarea:focus{
  outline:none;
  border-color:var(--mt-accent)!important;
  box-shadow:0 0 0 3px rgba(31,107,79,.13);
}

/* ── ตาราง ── */
.tableWrap,.rptScroll,.rcScroll,.bankTableWrap{border-radius:12px;overflow:auto}
tbody tr{transition:background .14s var(--mt-ease)}

/* ── แท็บ ── */
.rcTabs button,.bankAutoTabs button,.expenseTabSwitch button{
  border-radius:10px 10px 0 0;
  transition:background .2s var(--mt-ease),color .2s var(--mt-ease),transform .2s var(--mt-ease);
}
.rcTabs button:hover,.bankAutoTabs button:hover{transform:translateY(-1px)}
.expenseTabSwitch{border-radius:12px}
.expenseTabSwitch button{border-radius:9px}

/* ── Modal: เด้งขึ้นนุ่ม ── */
.modal{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.modal>form,.modal>div{
  border-radius:16px;box-shadow:var(--mt-shadow-lg);
  animation:mtPop .26s var(--mt-ease);
}
@keyframes mtPop{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}

/* ── แถบเวอร์ชัน ── */
.appVersion{
  display:inline-block;padding:3px 11px;border-radius:99px;
  background:rgba(31,107,79,.08);color:var(--mt-accent);
  font-size:11px;font-weight:700;letter-spacing:.2px;
}

/* ── Dock บนมือถือ: เมนูลอยด้านล่าง แตะง่าย ── */
@media(max-width:820px){
  aside nav{
    position:fixed;left:10px;right:10px;bottom:10px;z-index:60;
    flex-direction:row;gap:4px;
    padding:8px;margin:0;
    overflow-x:auto;overflow-y:hidden;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
    background:rgba(18,42,33,.94);
    backdrop-filter:blur(20px) saturate(1.3);
    -webkit-backdrop-filter:blur(20px) saturate(1.3);
    border:1px solid rgba(255,255,255,.12);
    border-radius:18px;
    box-shadow:var(--mt-shadow-lg);
  }
  aside nav::-webkit-scrollbar{display:none}
  aside nav button{
    flex:none;flex-direction:column;gap:4px;
    min-width:64px;padding:8px 6px!important;
    font-size:10px;line-height:1.25;text-align:center;
  }
  aside nav button::before{width:22px;height:22px}
  aside nav button:hover{transform:translateY(-3px)}
  aside nav button.active::after{display:none}
  aside nav button:active{transform:translateY(-3px) scale(.94)}
  .content{padding-bottom:104px}
}

/* ── เคารพผู้ใช้ที่ตั้งค่าลดการเคลื่อนไหว ── */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  aside nav button:hover,button:hover,.metric:hover{transform:none!important}
}
.projectLedgerTabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 22px 8px;padding:6px;background:#eef3ef;border:1px solid #d7e2da;border-radius:14px}
.projectLedgerTabs button{min-height:46px;border:0;border-radius:10px;background:transparent;color:#29453b;font-weight:700;font-size:16px;cursor:pointer}
.projectLedgerTabs button.active{background:#176b4f;color:#fff;box-shadow:0 5px 14px rgba(23,107,79,.2)}
@media(max-width:680px){.projectLedgerTabs{grid-template-columns:1fr;margin:14px 12px 6px}.projectLedgerTabs button{min-height:44px}}