/**
 * Nút hành động chính trong .table-toolbar: gọn, canh trái, width theo nội dung
 * (không kéo full / khối lớn). Dùng class .toolbar-primary-row trên wrapper nút.
 */

.table-toolbar .toolbar-primary-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    justify-content: flex-start;
    /* Không width:100% — nếu không flex item toolbar-left chiếm cả hàng, đẩy nút phải (ACTION) xuống dòng */
    max-width: 100%;
    min-width: 0;
}

/* list-key: nhóm trái + ACTION cùng một luồng trái→phải, hết chỗ mới wrap */
.table-toolbar .toolbar-row-primary {
    justify-content: flex-start !important;
    align-items: center !important;
}

.table-toolbar .toolbar-row-primary > .toolbar-left.toolbar-primary-row {
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

.table-toolbar .toolbar-row-primary > .toolbar-right {
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

/* Admin: toolbar-main — cột trái gọn, cột phải (Refresh) canh phải */
.table-toolbar .toolbar-main > .toolbar-left {
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

.table-toolbar .toolbar-main > .toolbar-right {
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: auto;
}

.table-toolbar .toolbar-primary-row > .btn,
.table-toolbar .toolbar-primary-row > .dropdown {
    flex: 0 1 auto;
    width: auto !important;
    max-width: 100%;
}

.table-toolbar .toolbar-primary-row > .dropdown .dropdown-toggle {
    width: auto !important;
    max-width: 100%;
}

/* Bulk / hàng phụ: một nút vẫn width theo nội dung */
.table-toolbar #bulkActionsContainer.toolbar-primary-row > .btn {
    width: auto !important;
    max-width: 100%;
}

/* Kích thước / chữ giống toolbar mẫu (solid, uppercase, padding vừa) */
.table-toolbar .toolbar-primary-row > .btn.btn-action-top,
.table-toolbar .toolbar-primary-row > .dropdown > .btn.btn-action-top {
    padding: 0.45rem 0.85rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.055em;
    text-transform: uppercase;
    border-radius: 0.5rem;
    line-height: 1.35;
    min-height: 2.35rem;
    box-shadow: 0 1px 2px rgba(55, 65, 81, 0.12);
    border: none;
}

.table-toolbar .toolbar-primary-row > .btn.btn-action-top i,
.table-toolbar .toolbar-primary-row > .dropdown > .btn.btn-action-top i {
    font-size: 1rem;
    vertical-align: middle;
}

/* Ghi đè app-buttons (gradient + hover nâng): toolbar gọn — màu đặc, không translateY */
.table-toolbar .toolbar-primary-row > .btn.btn-primary:not(.btn-outline-primary):not(.btn-label-primary),
.table-toolbar .toolbar-primary-row > .dropdown > .btn.btn-primary:not(.btn-outline-primary):not(.btn-label-primary) {
    background: #7367f0 !important;
    background-image: none !important;
    box-shadow: 0 1px 3px rgba(67, 89, 113, 0.2) !important;
    transform: none !important;
}

.table-toolbar .toolbar-primary-row > .btn.btn-primary:not(.btn-outline-primary):hover,
.table-toolbar .toolbar-primary-row > .dropdown > .btn.btn-primary:not(.btn-outline-primary):hover {
    filter: brightness(1.06);
    transform: none !important;
    box-shadow: 0 2px 6px rgba(67, 89, 113, 0.22) !important;
    color: #fff !important;
}

.table-toolbar .toolbar-primary-row > .btn.btn-danger:not(.btn-outline-danger):not(.btn-label-danger),
.table-toolbar .toolbar-primary-row > .dropdown > .btn.btn-danger:not(.btn-outline-danger):not(.btn-label-danger) {
    background: #e53935 !important;
    background-image: none !important;
    box-shadow: 0 1px 3px rgba(229, 57, 53, 0.28) !important;
    transform: none !important;
}

.table-toolbar .toolbar-primary-row > .btn.btn-danger:not(.btn-outline-danger):hover,
.table-toolbar .toolbar-primary-row > .dropdown > .btn.btn-danger:not(.btn-outline-danger):hover {
    filter: brightness(1.05);
    transform: none !important;
    box-shadow: 0 2px 6px rgba(229, 57, 53, 0.32) !important;
    color: #fff !important;
}

.table-toolbar .toolbar-primary-row > .btn.btn-outline-danger.btn-sm {
    padding: 0.4rem 0.75rem;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 0.5rem;
    min-height: 2.3rem;
}

body.dark-mode .table-toolbar .toolbar-primary-row > .btn.btn-action-top,
body.dark-mode .table-toolbar .toolbar-primary-row > .dropdown > .btn.btn-action-top {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}

/* Tránh canh giữa trên tablet khiến nút trông như full-width */
@media (max-width: 991.98px) {
    .table-toolbar .toolbar-main .toolbar-left.toolbar-primary-row {
        justify-content: flex-start !important;
    }
}

/* list-key: nút ACTION cột phải — cùng cỡ gọn, không full width */
.table-toolbar .toolbar-row-primary .toolbar-right .btn.btn-action-top,
.table-toolbar .toolbar-row-primary .toolbar-right .btn-toolbar-action {
    padding: 0.45rem 0.85rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.055em;
    text-transform: uppercase;
    border-radius: 0.5rem;
    line-height: 1.35;
    min-height: 2.35rem;
    width: auto !important;
    max-width: 100%;
    box-shadow: 0 1px 2px rgba(55, 65, 81, 0.12);
}

@media (max-width: 575.98px) {
    .table-toolbar .toolbar-primary-row > .btn.btn-action-top,
    .table-toolbar .toolbar-primary-row > .dropdown > .btn.btn-action-top {
        white-space: normal;
        text-align: center;
        min-height: 0;
    }
}