.btn-xs,
.btn.btn-xs {
    --phoenix-btn-padding-y: 0.4rem;
    --phoenix-btn-padding-x: 0.6rem;
    --phoenix-btn-font-size: 0.8rem;
    --phoenix-btn-border-radius: 0.2rem;
    --phoenix-btn-font-weight: normal;
}

.btn-tiny,
.btn.btn-tiny,
.btn-tiny-borderless,
.btn.btn-tiny-borderless {
    --phoenix-btn-padding-y: 2px;
    --phoenix-btn-padding-x: 4px;
    --phoenix-btn-font-size: 0.75rem;
    --phoenix-btn-border-radius: 0.2rem;
    --phoenix-btn-font-weight: normal;
    line-height: 1;
    min-height: calc(0.75rem + 6px);
}

/* btn-tiny carries the toolbar padding that used to be applied inline as px-2 py-1.
   btn-tiny-borderless keeps the tighter 2px/4px above. */
.btn-tiny,
.btn.btn-tiny {
    --phoenix-btn-padding-y: 0.25rem;
    --phoenix-btn-padding-x: 0.5rem;
    min-height: calc(0.75rem + 10px);
}

.btn-tiny-borderless,
.btn.btn-tiny-borderless {
    border: 0;
}

.btn-tiny.btn-icon,
.btn.btn-tiny.btn-icon,
.btn-tiny-borderless.btn-icon,
.btn.btn-tiny-borderless.btn-icon {
    width: calc(0.75rem + 10px);
    min-width: calc(0.75rem + 10px);
    height: calc(0.75rem + 10px);
    padding: 0;
}

.btn-tiny > i,
.btn-tiny > svg,
.btn-tiny-borderless > i,
.btn-tiny-borderless > svg {
    font-size: 0.75rem;
    line-height: 1;
}

.tabulator-btn,
.tabulator .tabulator-btn,
.tabulator a.tabulator-btn,
.tabulator button.tabulator-btn {
    padding: 2px 4px;
    margin-top: -1px;
}

.toast {
    padding: 0 !important;
}

.form-control-xs,
.form-control.form-control-xs {
    padding: 0.2rem 0.4rem;
    font-size: 0.8rem;
    border-radius: 0.2rem;
    min-height: calc(1.5em + 0.4rem + 6px);
}

.form-select-xs,
.form-select.form-select-xs {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
    padding-left: 0.4rem;
    padding-right: 1.5rem;
    font-size: 0.8rem;
    border-radius: 0.2rem;
    min-height: calc(1.5em + 0.4rem + 7px);
    background-position: right 0.4rem center;
    background-size: 8px 10px;
}

.highlightSearch {
    background-color: orange;
    color: #333;
}