/* HAKI POS — Demo skin: hover & hiệu ứng (CHỈ áp dụng bản demo) */

/* Sidebar: mượt + viền vàng khi hover/active */
.sidebar-menu li{ transition: background .18s ease, transform .18s ease, border-color .18s ease; border-left: 3px solid transparent; }
.sidebar-menu li:hover{ background: rgba(255,255,255,.07); border-left-color: #c89a4a; transform: translateX(3px); }
.sidebar-menu li.active{ border-left-color: #c89a4a; }

/* Nút: nhấc nhẹ + đổ bóng */
.btn{ transition: transform .15s ease, box-shadow .15s ease, filter .15s ease; }
.btn:hover{ transform: translateY(-1px); box-shadow: 0 4px 14px rgba(26,79,94,.22); filter: brightness(1.06); }
.btn:active{ transform: translateY(0); box-shadow: 0 1px 4px rgba(26,79,94,.18); }

/* Thẻ thống kê & card: nổi lên khi hover */
.card, .stat-card{ transition: box-shadow .2s ease, transform .2s ease; }
.card:hover{ box-shadow: 0 6px 22px rgba(31,42,46,.09); }
.stat-card:hover{ transform: translateY(-3px); box-shadow: 0 10px 24px rgba(31,42,46,.12); }

/* Món trong màn bán hàng: nhấc + viền vàng */
.menu-item{ transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; cursor: pointer; }
.menu-item:hover{ transform: translateY(-4px); box-shadow: 0 10px 22px rgba(31,42,46,.14); border-color: #c89a4a; }
.menu-item:active{ transform: translateY(-1px) scale(.99); }

/* Ô bàn: nhấc + viền xanh */
.table-card{ transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease; cursor: pointer; }
.table-card:hover{ transform: translateY(-3px); box-shadow: 0 8px 20px rgba(26,79,94,.16); border-color: #2a6f82; }

/* Tab danh mục */
.cat-tab{ transition: transform .14s ease, box-shadow .14s ease; }
.cat-tab:hover{ transform: translateY(-1px); box-shadow: 0 3px 10px rgba(31,42,46,.12); }

/* Dòng bảng dữ liệu */
.data-table tbody tr{ transition: background .12s ease; }
.data-table tbody tr:hover{ background: #eef4f5; }

/* Ô nhập liệu: viền xanh + quầng sáng khi focus */
input:focus, select:focus, textarea:focus{
  border-color: #2a6f82 !important;
  box-shadow: 0 0 0 3px rgba(42,111,130,.16) !important;
  outline: none;
}

/* Chuyển trang mượt */
@keyframes demoFadeUp{ from{ opacity: 0; transform: translateY(8px); } to{ opacity: 1; transform: none; } }
.page.active{ animation: demoFadeUp .22s ease; }

/* Modal hiện mềm */
@keyframes demoPop{ from{ opacity: 0; transform: scale(.97); } to{ opacity: 1; transform: scale(1); } }
.modal.active .modal-header, .modal.active .modal-body, .modal.active .modal-footer{ animation: demoPop .18s ease; }

/* Nút Báo giá demo trong sidebar */
#demo-baogia-item{ color: #c89a4a; font-weight: 600; margin-top: 6px; border-top: 1px solid rgba(255,255,255,.08); }
#demo-baogia-item:hover{ background: rgba(200,154,74,.12); }