:root {
    --bb-filter-operator-width: 150px;
}

/* style class disabled in form */
.disabled,
.select2-container--default.select2-container--disabled .select2-selection,
.select2-container--default.select2-container--disabled.select2-container--focus .select2-selection {
    color: var(--bb-gray-500) !important;
    background-color: var(--bb-bg-surface-secondary) !important;
    pointer-events: none !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__clear {
    padding: 15px 12px;
    right: 0;
}

.disabled:focus {
    box-shadow: none !important;
    border: var(--bb-border-width) solid var(--bb-border-color) !important;
}

/* style class hidden row in table */
.hidden-row,
.hidden-row > td  {
    background-color: var(--bb-gray-200-darken) !important;
    --bb-table-bg-type:var(--bb-gray-200-darken) !important;
}

.z-1020 {
    z-index: 1020 !important;
}

.btn-sm, .btn-group-sm > .btn {
    --bb-btn-line-height: 1.5;
}

.col-form-label, .form-label {
    display: block;
    font-weight: 700;
    font-size: 0.95rem;
}

.form-group > .form-label {
    font-weight: 600;
}

/* style for media page */
div.rv-media-container {
    height: 100dvh;
}

.rv-media-list-title .rv-media-file-name > span {
    display: inline-block;
    max-width: 500px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Disabled add button styles for project items */
.btn-add-invoice.disabled,
.btn-add-contract.disabled,
.btn-add-quotation.disabled,
.btn-add-invoice:disabled,
.btn-add-contract:disabled,
.btn-add-quotation:disabled {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
    color: var(--bb-gray-500) !important;
    background-color: var(--bb-gray-300) !important;
    border-color: var(--bb-gray-300) !important;
}

/* Style for modal table list */
.table-responsive-modal-custom {
    max-height: calc(60vh);
    overflow: auto;
}

.custom-filter-column-operator,
.custom-filter-column-operator + .select2-container,
.custom-filter-column-operator + .select2-container .select2-selection {
    width: var(--bb-filter-operator-width);
    min-width: var(--bb-filter-operator-width);
}