/* =========================================================
 * V74.1.34 - GHI CHÚ FULL CODE
 * ---------------------------------------------------------
 * File: assets/css/app-buttons.css
 *
 * Mục đích:
 * - Ghi chú rõ vai trò CSS để các trang sau giữ thống nhất giao diện.
 * - Không tự ý đổi màu/nút/bảng/form nếu yêu cầu chỉ là bổ sung ghi chú.
 * - CSS riêng từng trang chỉ dùng cho phần đặc thù, còn nút/bảng/form
 *   nên ưu tiên class chung app-*.
 * ========================================================= */

/* ==========================================================
   ERP - BO NUT DUNG CHUNG V3
   ----------------------------------------------------------
   Muc dich:
   - Dong bo mau sac nut tren toan bo he thong ERP.
   - Nut Sua: xanh hien dai.
   - Nut Xoa/Khoa: do ro rang.
   - Nut Luu/Them/Loc/Reset/Huy: dong bo, de nhin.

   Tuong thich:
   - PHP 5.3.4 khong lien quan CSS.
   - Hoat dong voi cac trang PHP hien tai: kho.php, danh_muc_nvl.php,
     nguoi_dung.php, phan_quyen.php va cac trang sau nay.
   ========================================================== */

/* Nut co ban */
.app-btn,
button.app-btn,
a.app-btn,
input.app-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    min-height: 40px !important;
    padding: 0 17px !important;
    border: 0 !important;
    border-radius: 14px !important;
    font-family: "Be Vietnam Pro", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease, opacity .16s ease !important;
}

.app-btn:hover {
    transform: translateY(-1px) !important;
}

.app-btn:active {
    transform: translateY(0) scale(.98) !important;
}

/* Nut trong cot Thao tac: gon hon nut chinh */
.app-btn-table,
.app-table td .app-btn,
.app-action-cell .app-btn,
.app-action-row .app-btn {
    min-height: 34px !important;
    padding: 0 13px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
}

/* Nut Sua - mau xanh */
.app-btn-edit,
button.app-btn-edit,
a.app-btn-edit {
    color: #ffffff !important;
    background: linear-gradient(135deg, #2563eb 0%, #0ea5e9 100%) !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, .24) !important;
	min-height: 30px !important;
	font-size: 13px !important;
	font-family: "Be Vietnam Pro", Arial, sans-serif !important;
	width: 80px !important;
}

.app-btn-edit:hover {
    background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%) !important;
    box-shadow: 0 14px 26px rgba(37, 99, 235, .28) !important;
}

/* Nut Xoa / Khoa - mau do */
.app-btn-delete,
button.app-btn-delete,
a.app-btn-delete,
.app-btn-danger,
button.app-btn-danger,
a.app-btn-danger {
    color: #ffffff !important;
    background: linear-gradient(135deg, #ff4d4f 0%, #ef4444 100%) !important;
    box-shadow: 0 10px 22px rgba(239, 68, 68, .22) !important;
}

.app-btn-delete:hover,
.app-btn-danger:hover {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%) !important;
    box-shadow: 0 14px 26px rgba(239, 68, 68, .28) !important;
}

/* Nut Them / Luu / Loc - mau xanh chinh */
.app-btn-add,
.app-btn-save,
.app-btn-filter,
.app-btn-primary,
button.app-btn-primary,
a.app-btn-primary {
    color: #ffffff !important;
    background: linear-gradient(135deg, #2563eb 0%, #0ea5e9 100%) !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, .24) !important;
}

.app-btn-add:hover,
.app-btn-save:hover,
.app-btn-filter:hover,
.app-btn-primary:hover {
    background: linear-gradient(135deg, #1d4ed8 0%, #0284c7 100%) !important;
    box-shadow: 0 16px 30px rgba(37, 99, 235, .30) !important;
}

/* Nut Khoi phuc / Mo khoa - xanh la */
.app-btn-success,
button.app-btn-success,
a.app-btn-success {
    color: #047857 !important;
    background: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%) !important;
    box-shadow: 0 10px 22px rgba(16, 185, 129, .16) !important;
}

/* Nut Reset / Huy / Nut phu */
.app-btn-reset,
.app-btn-cancel,
.app-btn-light,
button.app-btn-light,
a.app-btn-light,
.app-btn-secondary,
button.app-btn-secondary,
a.app-btn-secondary {
    color: #1d4ed8 !important;
    background: linear-gradient(135deg, #eef4ff 0%, #e8eefc 100%) !important;
    box-shadow: none !important;
}

.app-btn-reset:hover,
.app-btn-cancel:hover,
.app-btn-light:hover,
.app-btn-secondary:hover {
    background: linear-gradient(135deg, #dbeafe 0%, #dbeafe 100%) !important;
}

/* Canh hang nut trong cot thao tac */
.app-action-cell,
.app-action-row {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
}

.app-table td form {
    display: inline-flex !important;
    margin: 0 !important;
    padding: 0 !important;
}

.app-table td:last-child {
    white-space: nowrap !important;
}

/* Mobile: nut thao tac van gon, khong chiem qua nhieu dien tich */
@media (max-width: 768px) {
    .app-btn,
    button.app-btn,
    a.app-btn {
        min-height: 42px !important;
        padding: 0 15px !important;
        border-radius: 14px !important;
        font-size: 14px !important;
    }

    .app-btn-table,
    .app-table td .app-btn,
    .app-action-cell .app-btn,
    .app-action-row .app-btn {
        min-height: 36px !important;
        padding: 0 12px !important;
        border-radius: 12px !important;
        font-size: 13px !important;
    }

    .app-action-cell,
    .app-action-row {
        gap: 7px !important;
    }
}