/* ============================================================
BUTTON STYLES (COMPACT & RESPONSIVE)
============================================================ */

.btn-primary-cnap, .btn-secondary, .btn-outline-primary, .btn-home {
font-weight: 500;
padding: 0.4rem 0.85rem;
border-radius: 6px;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 6px;
transition: all 0.2s ease;
}

.btn-home {
color: var(--cnap-primary);
background: transparent;
border: 1px solid transparent;
}

.btn-home:hover {
background: var(--cnap-primary-dark);
color: #fff;
}

.btn-primary-cnap {
background: var(--cnap-primary-blue);
border: 1px solid var(--cnap-primary-blue);
color: #fff;
}

.btn-primary-cnap:hover {
background: var(--cnap-primary-orange);
color: #fff;
box-shadow: 0 4px 8px rgba(2, 132, 199, 0.25);
}

.btn-secondary {
background: transparent;
border: 1px solid #dc3545;
color: #dc3545;
}

.btn-secondary:hover {
background: #dc3545;
color: #fff;
}

.btn-outline-primary {
background: transparent;
border: 1px solid var(--cnap-primary);
color: var(--cnap-primary);
}

.btn-outline-primary:hover {
background: var(--cnap-primary);
color: #fff;
}

/* Khung viền và kích thước chuẩn của Nút Action trong Table / Grid */
.btn-action {
border: none;
background: transparent;
width: 32px;
height: 32px;
border-radius: 6px;
margin: 0 3px;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
transition: background 0.2s ease;
}

/* 1. Nút Sửa (Edit) */
.btn-action.btn-edit {
color: var(--cnap-primary);
}

.btn-action.btn-edit:hover {
background: rgb(108, 144, 250);
}

/* 2. Nút Xóa (Delete) */
.btn-action.btn-delete {
color: #dc3545;
}

.btn-action.btn-delete:hover {
background: #fac3bc;
}
/* 1. Nút Sửa (Edit) */
.btn-action.btn-success {
color: var(--cnap-primary-green);
}

.btn-action.btn-success:hover {
background: rgb(60, 247, 101);
}
/* 3. Nút Lưu (Save) */
.btn-action.btn-save {
color: #198754;
}

.btn-action.btn-save:hover {
background: #e7f6ee;
}

.btn-action.btn-save:disabled {
color: #adb5bd;
cursor: not-allowed;
background: transparent;
}

/* Nút Toolbar Excel nhỏ gọn */
#excelToolbar .btn {
padding: 0.3rem 0.6rem;
font-size: 0.775rem;
line-height: 1.3;
border-radius: 0.4rem;
}

#excelToolbar .btn i {
font-size: 0.75rem;
}

/* Responsive cho nút bấm trên mobile */
@media (max-width: 991.98px) {
.btn-primary-cnap, .btn-secondary, .btn-outline-primary, .btn-home {
padding: 7px 12px;
font-size: 0.825rem;
}
}