/* Ant Design theme bridge, global search, toasts and runtime framework states. */
.theme-techblue .ant-table,
.theme-techblue .ant-table-container,
.theme-techblue .ant-table-thead > tr > th,
.theme-techblue .ant-table-tbody > tr > td,
.theme-techblue .ant-table-placeholder,
.theme-techblue .ant-pagination,
.theme-techblue .ant-empty-description,
.theme-techblue .ant-drawer-content,
.theme-techblue .ant-drawer-header,
.theme-techblue .ant-modal-content,
.theme-techblue .ant-modal-header,
.theme-techblue .ant-form-item-label > label {
    background: var(--fx-panel);
    color: var(--fx-text);
    border-color: var(--fx-border);
}

.theme-techblue h1,
.theme-techblue h2,
.theme-techblue h3,
.theme-techblue h4,
.theme-techblue h5,
.theme-techblue h6,
.theme-techblue .ant-typography,
.theme-techblue .ant-card-head-title,
.theme-techblue .ant-card-meta-title,
.theme-techblue .ant-descriptions-title,
.theme-techblue .ant-statistic-content,
.theme-techblue .ant-modal-confirm-title,
.theme-techblue .ant-result-title,
.theme-techblue .ant-page-header-heading-title {
    color: var(--fx-text);
}

.theme-techblue .ant-card,
.theme-techblue .ant-card-head,
.theme-techblue .ant-card-body,
.theme-techblue .ant-popover-inner,
.theme-techblue .ant-popover-title,
.theme-techblue .ant-dropdown-menu {
    background: var(--fx-panel);
    color: var(--fx-text);
    border-color: var(--fx-border);
}

.theme-techblue .ant-card-meta-description,
.theme-techblue .ant-descriptions-item-label,
.theme-techblue .ant-descriptions-item-content,
.theme-techblue .ant-statistic-title,
.theme-techblue .ant-form-item-extra,
.theme-techblue .ant-form-item-explain,
.theme-techblue .ant-modal-confirm-content,
.theme-techblue .ant-result-subtitle,
.theme-techblue .ant-popover-inner-content,
.theme-techblue .ant-dropdown-menu-item,
.theme-techblue .ant-radio-wrapper,
.theme-techblue .ant-checkbox-wrapper {
    color: var(--fx-text-muted);
}

.theme-techblue .ant-table-column-title,
.theme-techblue .ant-table-thead .ant-table-column-sorters,
.theme-techblue .ant-table-thead .ant-table-filter-column {
    color: var(--fx-text);
}

.theme-techblue .ant-table-column-sorter,
.theme-techblue .ant-table-filter-trigger,
.theme-techblue .ant-pagination-item-link,
.theme-techblue .ant-select-arrow,
.theme-techblue .ant-picker-suffix {
    color: var(--fx-text-muted);
}

.theme-techblue .ant-tabs-nav,
.theme-techblue .ant-tabs-content-holder {
    color: var(--fx-text);
}

.theme-techblue .ant-tabs-tab .ant-tabs-tab-btn {
    color: var(--fx-text-muted);
}

.theme-techblue .ant-tabs-tab-active .ant-tabs-tab-btn,
.theme-techblue .ant-tabs-tab:hover .ant-tabs-tab-btn {
    color: var(--fx-primary);
}

.theme-techblue .ant-tabs-ink-bar {
    background: var(--fx-primary);
}

.theme-techblue .ant-table-tbody > tr.ant-table-row:hover > td {
    background: var(--fx-panel-muted);
}

.theme-techblue .ant-input,
.theme-techblue .ant-input-number,
.theme-techblue .ant-input-number-input,
.theme-techblue .ant-input-affix-wrapper,
.theme-techblue .ant-select-selector,
.theme-techblue .ant-select-dropdown,
.theme-techblue .ant-picker,
.theme-techblue .ant-picker-input > input,
.theme-techblue textarea.ant-input {
    background: var(--fx-panel-muted) !important;
    color: var(--fx-text) !important;
    border-color: var(--fx-border) !important;
}

.theme-techblue .ant-select-selection-item,
.theme-techblue .ant-select-item {
    color: var(--fx-text);
}

.theme-techblue .ant-select-multiple .ant-select-selection-item {
    background: color-mix(in srgb, var(--fx-primary) 14%, var(--fx-panel)) !important;
    border-color: color-mix(in srgb, var(--fx-primary) 42%, var(--fx-border)) !important;
    color: var(--fx-text) !important;
}

.theme-techblue .ant-select-multiple .ant-select-selection-item-content {
    color: inherit !important;
}

.theme-techblue .ant-select-multiple .ant-select-selection-item-remove {
    color: var(--fx-text-muted) !important;
}

.theme-techblue .ant-select-multiple .ant-select-selection-item-remove:hover {
    color: var(--fx-error) !important;
}

.theme-techblue .ant-select-item-option-active,
.theme-techblue .ant-select-item-option-selected {
    background: var(--fx-nav-hover) !important;
}

.theme-techblue .ant-input::placeholder,
.theme-techblue textarea.ant-input::placeholder,
.theme-techblue .ant-select-selection-placeholder {
    color: var(--fx-text-muted) !important;
}

.theme-techblue .ant-btn:not(.ant-btn-primary):not(.ant-btn-dangerous) {
    background: var(--fx-panel);
    color: var(--fx-text-muted);
    border-color: var(--fx-border);
}

.theme-techblue .ant-btn:not(.ant-btn-primary):not(.ant-btn-dangerous):hover {
    color: var(--fx-primary);
    border-color: var(--fx-primary);
}

.theme-techblue .ant-drawer-close,
.theme-techblue .ant-drawer-title,
.theme-techblue .ant-modal-title {
    color: var(--fx-text);
}

.theme-techblue .ant-alert {
    background: var(--fx-panel-muted);
    color: var(--fx-text);
    border-color: var(--fx-border);
}

.theme-techblue .ant-alert-message {
    color: var(--fx-text) !important;
}

.theme-techblue .ant-alert-description {
    color: var(--fx-text-muted) !important;
}

.theme-techblue .ant-divider {
    border-color: var(--fx-border);
}

.theme-techblue .ant-tag {
    border-color: var(--fx-border);
}

.ant-drawer-body form > .ant-form-item:last-child {
    position: sticky;
    bottom: -24px;
    z-index: 2;
    margin: 16px -24px -24px;
    padding: 12px 24px;
    border-top: 1px solid var(--fx-border);
    background: var(--fx-panel);
}

textarea.ant-input,
.ant-input[type="password"],
.ant-input[type="text"] {
    min-height: 32px;
}

textarea.ant-input {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

@media (max-width: 1280px) {
    .metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-grid,
    .detail-grid {
        grid-template-columns: 1fr;
    }

    .thing-global-layout {
        grid-template-columns: minmax(0, 1fr) 320px;
    }
}



.fx-toast-stack {
    position: fixed;
    right: 18px;
    top: 72px;
    z-index: 1200;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: min(360px, calc(100vw - 32px));
}

.fx-toast {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 12px 12px;
    color: var(--fx-text);
    background: var(--fx-panel);
    border: 1px solid var(--fx-border);
    border-radius: 8px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.14);
}

.fx-toast.success .anticon {
    color: #16a34a;
}

.fx-toast.error .anticon {
    color: #dc2626;
}

.fx-toast.info .anticon {
    color: var(--fx-primary);
}

.fx-toast span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.fx-toast button {
    width: 24px;
    height: 24px;
    border: none;
    color: var(--fx-muted);
    background: transparent;
    cursor: pointer;
}

@media (max-width: 620px) {
    .metric-grid,
    .thing-focus-metrics {
        grid-template-columns: 1fr;
    }

    .connection-panel-header {
        align-items: stretch;
        flex-direction: column;
    }

    .connection-field-grid {
        grid-template-columns: 1fr;
    }

    .filter-bar {
        align-items: stretch;
    }

    .list-toolbar,
    .thing-panel-toolbar,
    .member-picker-toolbar,
    .ingestion-endpoint-bar {
        align-items: stretch;
        flex-direction: column;
    }

    .ingestion-endpoint-copy {
        align-items: flex-start;
        flex-direction: column;
    }

    .ingestion-endpoint-bar > button {
        width: 100%;
    }

    .list-toolbar-filters,
    .list-toolbar-actions {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
    }

    .filter-bar > *,
    .filter-bar .ant-input-group,
    .filter-bar .ant-select,
    .filter-bar .ant-input,
    .filter-bar button,
    .list-toolbar > *,
    .thing-panel-toolbar > *,
    .list-toolbar .ant-input-group,
    .thing-panel-toolbar .ant-input-group,
    .list-toolbar .ant-select,
    .thing-panel-toolbar .ant-select,
    .list-toolbar .ant-input,
    .thing-panel-toolbar .ant-input,
    .list-toolbar button,
    .thing-panel-toolbar button,
    .member-picker-toolbar .ant-input,
    .member-picker-toolbar button,
    .import-upload-button {
        width: 100% !important;
    }

    .workspace-left {
        flex-direction: column;
        align-items: stretch;
    }

    .fx-bar-row {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .fx-bar-row strong {
        text-align: left;
    }
}

#blazor-error-ui {
    background: #fff7e6;
    border-top: 1px solid #ffd591;
    bottom: 0;
    box-shadow: 0 -6px 18px rgba(15, 23, 42, 0.12);
    color: #7c4a03;
    display: none;
    left: 0;
    padding: 10px 16px;
    position: fixed;
    right: 0;
    z-index: 10000;
}

#blazor-error-ui[data-state="offline"],
#blazor-error-ui[data-state="failed"] {
    background: #fff2f0;
    border-top-color: #ffccc7;
    color: #a8071a;
}

#blazor-error-ui .reload {
    color: #1677ff;
    margin-left: 12px;
}

#blazor-error-ui button {
    background: none;
    border: 0;
    color: #1677ff;
    cursor: pointer;
    margin-left: 12px;
    padding: 0;
}

.global-search-wrapper {
    position: relative;
    flex: 0 0 auto;
    width: 32px;
    transition: width 0.2s ease;
}

.global-search-wrapper.expanded {
    width: clamp(260px, 28vw, 380px);
}

.global-search-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 30px;
    padding: 0;
    border: 1px solid var(--fx-border);
    border-radius: 6px;
    background: var(--fx-panel);
    color: var(--fx-text-muted);
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s;
}

.global-search-trigger:hover {
    border-color: var(--fx-primary);
    color: var(--fx-primary);
    background: var(--fx-nav-hover);
}

.global-search-inline {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    height: 32px;
    padding: 0 4px 0 10px;
    background: var(--fx-panel);
    border: 1px solid var(--fx-border);
    border-radius: 6px;
    color: var(--fx-text-muted);
    box-sizing: border-box;
}

.global-search-inline:focus-within {
    border-color: var(--fx-primary);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--fx-primary) 12%, transparent);
}

.global-search-input {
    flex: 1;
    min-width: 0;
    height: 28px;
    padding: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--fx-text);
    font: inherit;
    font-size: 13px;
}

.global-search-input::placeholder {
    color: var(--fx-text-muted);
}

.global-search-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 28px;
    border: none;
    background: transparent;
    border-radius: 6px;
    color: var(--fx-text-muted);
    cursor: pointer;
    transition: all 0.2s;
}

.global-search-dropdown {
    position: absolute;
    top: calc(100% + 7px);
    right: 0;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    width: min(440px, calc(100vw - 28px));
    max-height: min(66vh, 560px);
    overflow: hidden;
    border: 1px solid var(--fx-border);
    border-radius: 8px;
    background: var(--fx-panel);
    box-shadow: var(--fx-shadow);
}

.global-search-close:hover {
    background: var(--fx-panel-muted);
    color: var(--fx-text);
}

.global-search-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 32px;
    color: var(--fx-text-muted);
}

.global-search-empty {
    padding: 32px;
}

.global-search-results {
    flex: 1;
    overflow-y: auto;
    padding: 8px;
}

.global-search-section {
    margin-bottom: 12px;
}

.global-search-section:last-child {
    margin-bottom: 0;
}

.global-search-section-title {
    font-size: 12px;
    color: var(--fx-text-muted);
    font-weight: 500;
    padding: 4px 8px;
    margin-bottom: 4px;
}

.global-search-result-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 12px;
    border: none;
    background: transparent;
    border-radius: 6px;
    cursor: pointer;
    text-align: left;
    transition: all 0.15s;
}

.global-search-result-item:hover {
    background: var(--fx-nav-hover);
}

.global-search-result-item.active {
    background: var(--fx-nav-icon-active);
}

.global-search-result-info {
    flex: 1;
    min-width: 0;
}

.global-search-result-name {
    font-size: 14px;
    color: var(--fx-text);
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.global-search-result-meta {
    font-size: 12px;
    color: var(--fx-text-muted);
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.global-search-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 8px 16px;
    border-top: 1px solid var(--fx-border);
    background: var(--fx-panel-muted);
    font-size: 12px;
    color: var(--fx-text-muted);
}

@media (max-width: 920px) {
    .global-search-wrapper.expanded {
        width: min(360px, calc(100vw - 180px));
    }
}

.alarm-level-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.alarm-level-tag svg {
    width: 14px;
    height: 14px;
}
