/* Font chung có dấu tiếng Việt. Vuetify mặc định "Roboto, sans-serif": Windows không có Roboto nên rơi về
   font "sans-serif" cài trong Chrome — có thể thiếu/vỡ dấu tiếng Việt. Liệt kê font hệ thống trước generic.
   Selector có tiền tố html để thắng .text-h6/.text-subtitle-1... của vuetify.min.css (nạp sau file này). */
:root {
    --app-font: Roboto, "Segoe UI", Arial, "Helvetica Neue", "Noto Sans", "DejaVu Sans", sans-serif;
}
html,
html body,
html .v-application,
html [class^="text-"],
html [class*=" text-"] {
    font-family: var(--app-font);
}

.btn-tool-bar {
    width: 100px;
}

/* Style header dùng chung cho các bảng chính (Templates/Devices/TemplatePointsView/Setting) */
.tbl-th {
    background: #fff !important;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 11px;
    line-height: 1;
    letter-spacing: 0.1em;
    color: #78909C;
    padding: 14px 12px 12px !important;
    border-bottom: 1px solid #d7dee6 !important;
    white-space: nowrap;
}
.tbl-th--id {
    color: rgb(var(--v-theme-primary));
}
.tbl-th--center {
    text-align: center;
}
.tbl-th--right {
    text-align: right;
    padding-right: 16px !important;
}

/* Toolbar chung cho trang cấu hình (Devices / Templates / Template Points).
   Một hàng duy nhất, KHÔNG wrap → chiều cao cố định, không làm lệch phép đo chiều cao bảng.
   Hẹp thì nút chỉ còn icon (ẩn .cfg-label) thay vì chồng lên nhau; ô Search co lại trước. */
.cfg-toolbar {
    container-type: inline-size;
    display: flex;
    flex: none;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    min-height: 56px;
    padding: 0 16px;
}
.cfg-toolbar > * {
    flex: none;
}
.cfg-toolbar > .cfg-toolbar__spacer {
    flex: 1 1 0;
    min-width: 0;
}
.cfg-toolbar > .cfg-toolbar__search {
    flex: 0 1 260px;
    min-width: 140px;
}
.cfg-toolbar .v-btn {
    white-space: nowrap;
}
@container (max-width: 820px) {
    .cfg-toolbar .cfg-label {
        display: none;
    }
    .cfg-toolbar .v-btn {
        min-width: 40px;
        padding: 0 10px;
    }
    .cfg-toolbar .v-btn.btn-tool-bar {
        width: auto;
    }
    .cfg-toolbar .v-btn .v-btn__prepend {
        margin-inline: 0;
    }
}