/*
 * HES panel theme
 * Change colors here to restyle light/dark chrome, page, and content.
 * Status badges keep their original colors and must not be restyled.
 */

:root {
    --hes-chrome-bg: #b5e9de;
    --hes-chrome-text: #115e59;
    --hes-page-bg: #b5e9de;
    --hes-content-bg: #ccfbf1;
    --hes-accent: #ccfbf1;
    --hes-accent-strong: #14b8a6;
    --hes-accent-active: #0d9488;
    --hes-text: #0f172a;
    --hes-muted: #334155;
    --hes-border: #99f6e4;
    --hes-card-border: #0d9488;
    --hes-button-bg: #fbbf24;
    --hes-button-text: #000000;
    --hes-button-hover-bg: #f59e0b;
    --hes-panel-chrome-bg: var(--hes-chrome-bg);
    --hes-panel-chrome-text: var(--hes-chrome-text);
    --hes-panel-button-bg: var(--hes-button-bg);
    --hes-panel-button-text: var(--hes-button-text);
    --hes-panel-button-hover-bg: var(--hes-button-hover-bg);
}

html.dark {
    --hes-chrome-bg: #115e59;
    --hes-chrome-text: #ccfbf1;
    --hes-page-bg: #0d4b47;
    --hes-content-bg: #115e59;
    --hes-accent: #ccfbf1;
    --hes-accent-strong: #5eead4;
    --hes-accent-active: #0d9488;
    --hes-text: #ccfbf1;
    --hes-muted: #99f6e4;
    --hes-border: color-mix(in srgb, #ccfbf1 28%, transparent);
    --hes-card-border: #ccfbf1;
}

/* Sidebar + header */

.fi-sidebar,
.fi-sidebar.fi-sidebar-open,
.fi-sidebar:where(.dark, .dark *),
.fi-sidebar-header,
.fi-body-has-topbar .fi-sidebar-header,
.fi-body-has-topbar .fi-sidebar-header:where(.dark, .dark *),
.fi-topbar,
.fi-topbar:where(.dark, .dark *) {
    background-color: var(--hes-chrome-bg) !important;
    --tw-ring-color: color-mix(in oklab, #000 12%, transparent);
}

@media (min-width: 64rem) {
    .fi-sidebar,
    .fi-sidebar:where(.dark, .dark *) {
        background-color: var(--hes-chrome-bg) !important;
    }
}

.fi-sidebar .fi-logo,
.fi-topbar .fi-logo,
.fi-sidebar-group-label,
.fi-sidebar-group-label:where(.dark, .dark *),
.fi-sidebar-item-label,
.fi-sidebar-item-btn,
.fi-sidebar .fi-user-menu-trigger .fi-tenant-menu-trigger-text,
.fi-sidebar .fi-user-menu-trigger .fi-tenant-menu-trigger-text:where(.dark, .dark *),
.fi-topbar .fi-user-menu-trigger {
    color: var(--hes-chrome-text) !important;
}

.fi-sidebar .fi-icon,
.fi-sidebar .fi-sidebar-item-btn > .fi-icon,
.fi-sidebar-group-btn .fi-icon,
.fi-sidebar-group-collapse-btn,
.fi-sidebar-group-collapse-btn .fi-icon,
.fi-sidebar .fi-icon-btn,
.fi-sidebar .fi-icon-btn .fi-icon {
    color: var(--hes-chrome-text) !important;
}

.hes-panel-header__select {
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
    border-color: var(--hes-card-border) !important;
}

.hes-panel-header__select option {
    background-color: var(--hes-chrome-bg);
    color: var(--hes-chrome-text);
}

.fi-topbar .fi-icon-btn,
.fi-topbar .fi-icon {
    color: #000 !important;
}

html.dark .fi-topbar .fi-icon-btn:not(.fi-btn),
html.dark .fi-topbar .fi-icon:not(.fi-btn .fi-icon) {
    color: var(--hes-accent) !important;
}

.fi-sidebar-item.fi-sidebar-item-has-url > .fi-sidebar-item-btn:hover,
.fi-sidebar-item.fi-sidebar-item-has-url > .fi-sidebar-item-btn:focus-visible {
    background-color: color-mix(in srgb, var(--hes-accent-strong) 35%, transparent) !important;
}

.fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
    background-color: var(--hes-accent-active) !important;
}

.fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-sidebar-item-label,
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-icon {
    color: #fff !important;
}

html.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-sidebar-item-label,
html.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-icon {
    color: var(--hes-accent) !important;
}

.fi-body-has-topbar .fi-btn.fi-color-primary:not(.fi-outlined),
.fi-body-has-navigation .fi-btn.fi-color-primary:not(.fi-outlined) {
    --bg: var(--hes-button-bg);
    --text: var(--hes-button-text);
    --hover-bg: var(--hes-button-hover-bg);
    --hover-text: var(--hes-button-text);
    --dark-bg: var(--hes-button-bg);
    --dark-text: var(--hes-button-text);
    --dark-hover-bg: var(--hes-button-hover-bg);
    --dark-hover-text: var(--hes-button-text);
    background-color: var(--hes-button-bg) !important;
    color: var(--hes-button-text) !important;
}

.fi-body-has-topbar .fi-btn.fi-color-primary:not(.fi-outlined) .fi-icon,
.fi-body-has-navigation .fi-btn.fi-color-primary:not(.fi-outlined) .fi-icon {
    color: var(--hes-button-text) !important;
}

/* Page canvas */

.fi-body,
.fi-layout,
.fi-main-ctn,
.fi-main,
.fi-page,
.fi-page-content {
    background-color: var(--hes-page-bg) !important;
}

.fi-header-heading,
.fi-header-subheading {
    color: var(--hes-text);
}

html.dark .fi-header-heading,
html.dark .fi-header-subheading {
    color: var(--hes-accent) !important;
}

/* Content surfaces — never include status badges */

.hes-dashboard__stat,
.hes-dashboard-card,
.hes-user-profile__card,
.hes-devices-sidebar,
.hes-network-status-card,
.fi-section,
.fi-wi-widget,
.fi-ta-ctn {
    background-color: var(--hes-content-bg) !important;
}

html.dark .fi-ta-ctn {
    background-color: transparent !important;
}

html.dark .fi-section,
html.dark .fi-wi-widget,
html.dark .hes-dashboard__stat,
html.dark .hes-dashboard-card,
html.dark .hes-devices-sidebar,
html.dark .hes-user-profile__card,
html.dark .hes-dashboard-events__table th {
    background-color: var(--hes-content-bg) !important;
    border-color: var(--hes-border) !important;
}

html.dark .hes-dashboard__stat-label,
html.dark .hes-dashboard-card__header,
html.dark .hes-dashboard-metric__label,
html.dark .hes-dashboard-metric__value,
html.dark .hes-dashboard-kv__label,
html.dark .hes-dashboard-kv__value,
html.dark .hes-dashboard-events__table th,
html.dark .hes-dashboard-events__table td,
html.dark .hes-user-profile__card h3,
html.dark .hes-user-profile__card dt,
html.dark .hes-user-profile__card dd {
    color: var(--hes-accent) !important;
}

.hes-dashboard-metric.is-active {
    background: color-mix(in srgb, var(--hes-accent-strong) 35%, transparent) !important;
}

html.dark .hes-dashboard-metric.is-active {
    background: color-mix(in srgb, var(--hes-accent-strong) 35%, transparent) !important;
}

.hes-dashboard-card.hes-dashboard-card--chrome,
html.dark .hes-dashboard-card.hes-dashboard-card--chrome,
.hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-card__header,
html.dark .hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-card__header,
.hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-card__body,
html.dark .hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-card__body,
.hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-events__table,
html.dark .hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-events__table,
.hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-events__table th,
html.dark .hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-events__table th,
.hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-events__table td,
html.dark .hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-events__table td,
.hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-events__empty,
html.dark .hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-events__empty {
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
    border-color: var(--hes-card-border) !important;
}

.hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-card__header,
html.dark .hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-card__header {
    border-bottom-color: var(--hes-card-border) !important;
}

.hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-events__table th,
.hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-events__table td,
html.dark .hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-events__table th,
html.dark .hes-dashboard-card.hes-dashboard-card--chrome .hes-dashboard-events__table td {
    border-bottom-color: var(--hes-border) !important;
}

html.dark .hes-dashboard-card__header {
    border-bottom-color: var(--hes-border) !important;
}

html.dark .hes-user-profile__card {
    box-shadow: none;
}

/* Devices list surfaces that follow the panel sidebar chrome */

.hes-devices-sidebar__map {
    width: 7rem;
    height: 7rem;
    border-radius: 9999px;
    overflow: hidden;
    border: 2px solid var(--hes-border);
    background-color: var(--hes-chrome-bg) !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hes-devices-sidebar__path {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    width: 100%;
    background-color: var(--hes-chrome-bg) !important;
    border-radius: 0.5rem;
    padding: 0.375rem 0.5rem;
}

.hes-devices-sidebar__path-part {
    font-size: 0.8125rem;
    font-weight: 500;
    color: color-mix(in srgb, var(--hes-chrome-text) 72%, transparent) !important;
}

.hes-devices-sidebar__path-part.is-primary {
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--hes-chrome-text) !important;
}

.hes-devices-sidebar__user {
    width: 100%;
    border-top: 1px solid var(--hes-border);
    padding-top: 0.75rem;
    background-color: var(--hes-chrome-bg) !important;
    border-radius: 0.5rem;
    padding: 0.75rem 0.5rem 0.375rem;
}

.hes-devices-sidebar__user-name {
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--hes-chrome-text) !important;
}

.hes-devices-sidebar__user-role {
    font-size: 0.8125rem;
    margin-top: 0.125rem;
    color: color-mix(in srgb, var(--hes-chrome-text) 72%, transparent) !important;
}

.hes-devices-sidebar__counts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    font-size: 0.8125rem;
}

.hes-devices-sidebar__count {
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.375rem 0.5rem;
    border-radius: 0.5rem;
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
}

.hes-devices-sidebar__count-label,
.hes-devices-sidebar__count-value {
    color: var(--hes-chrome-text) !important;
}

.hes-devices-sidebar__count-value {
    font-weight: 700;
}

.hes-sidebar-stat {
    background: var(--hes-chrome-bg) !important;
    border-color: var(--hes-border) !important;
}

.hes-sidebar-stat__label,
.hes-sidebar-stat__value,
.hes-sidebar-stat__icon {
    color: var(--hes-chrome-text) !important;
}

.hes-sidebar-stat--gas .hes-sidebar-stat__icon,
.hes-sidebar-stat--meters .hes-sidebar-stat__icon,
.hes-sidebar-stat--subscribers .hes-sidebar-stat__icon {
    background: color-mix(in srgb, var(--hes-chrome-text) 12%, var(--hes-chrome-bg)) !important;
    border-color: var(--hes-border) !important;
    color: var(--hes-chrome-text) !important;
}

.hes-devices-sidebar__add-btn {
    width: 100%;
    min-height: 2.75rem;
    border: 1px solid var(--hes-border);
    border-radius: 0.625rem;
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
    font-size: 0.9375rem;
    font-weight: 700;
    cursor: pointer;
}

.hes-devices-sidebar__add-btn:hover {
    background-color: color-mix(in srgb, var(--hes-chrome-text) 12%, var(--hes-chrome-bg)) !important;
}

.fi-resource-devices.fi-resource-list-records-page .fi-ta-filters .fi-fo-select-wrp .fi-input-wrp,
.fi-resource-devices.fi-resource-list-records-page .hes-devices-table-search .fi-input-wrp {
    background-color: var(--hes-chrome-bg) !important;
    border-color: var(--hes-border) !important;
    --tw-ring-color: var(--hes-accent-active);
}

.fi-resource-devices.fi-resource-list-records-page .fi-ta-filters .fi-select-input,
.fi-resource-devices.fi-resource-list-records-page .hes-devices-table-search .fi-input {
    color: var(--hes-chrome-text) !important;
    background-color: transparent !important;
}

.fi-resource-devices.fi-resource-list-records-page .fi-ta-filters .fi-fo-select-wrp .fi-input-wrp .fi-icon,
.fi-resource-devices.fi-resource-list-records-page .hes-devices-table-search .fi-input-wrp .fi-icon {
    color: var(--hes-chrome-text) !important;
}

.fi-resource-devices.fi-resource-list-records-page .hes-devices-table-search .fi-input::placeholder {
    color: color-mix(in srgb, var(--hes-chrome-text) 65%, transparent) !important;
}

.fi-resource-devices.fi-resource-list-records-page .fi-ta-filters .fi-fo-field-wrp-label,
.fi-resource-devices.fi-resource-list-records-page .fi-ta-filters .fi-fo-field-label-content {
    color: var(--hes-chrome-text) !important;
}

/* List tables that follow panel sidebar chrome */

:is(
    .fi-resource-devices,
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-ctn {
    background-color: var(--hes-chrome-bg) !important;
    border-color: var(--hes-card-border) !important;
}

:is(
    .fi-resource-devices,
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-table .fi-ta-header-cell,
:is(
    .fi-resource-devices,
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-table .hes-devices-list-header,
:is(
    .fi-resource-devices,
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-table .fi-ta-actions-header-cell,
:is(
    .fi-resource-devices,
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-table .fi-ta-empty-header-cell,
:is(
    .fi-resource-devices,
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-table .fi-ta-cell,
:is(
    .fi-resource-devices,
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-table .fi-ta-row,
:is(
    .fi-resource-devices,
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-table thead th {
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
    border-color: var(--hes-border) !important;
}

:is(
    .fi-resource-devices,
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-table .fi-ta-header-cell *,
:is(
    .fi-resource-devices,
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-table .hes-devices-list-header *,
:is(
    .fi-resource-devices,
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-table .fi-ta-cell *:not(.hes-ticket-badge, .hes-ticket-badge *, .fi-badge, .fi-badge *, [style*="color"]) {
    color: var(--hes-chrome-text) !important;
}

:is(
    .fi-resource-devices,
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-table .fi-ta-row:hover .fi-ta-cell {
    background-color: color-mix(in srgb, var(--hes-chrome-text) 10%, var(--hes-chrome-bg)) !important;
}

:is(
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-input-wrp {
    background-color: var(--hes-chrome-bg) !important;
    border-color: var(--hes-border) !important;
    color: var(--hes-chrome-text) !important;
    --tw-ring-color: var(--hes-accent-active);
}

:is(
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-input,
:is(
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-select-input {
    color: var(--hes-chrome-text) !important;
    background-color: transparent !important;
}

:is(
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-input-wrp .fi-icon,
:is(
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-header-toolbar,
:is(
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-pagination,
:is(
    .fi-resource-meter-alerts,
    .fi-resource-meter-events,
    .fi-resource-meter-event-definitions,
    .fi-resource-obis-metadata,
    .fi-resource-tickets,
    .fi-resource-ticket-departments,
    .fi-resource-ticket-subject-categories,
    .fi-resource-users,
    .fi-resource-ticket-tags,
    .fi-resource-activities,
    .fi-resource-subscriber-categories,
    .fi-resource-communication-quality-categories,
    .fi-resource-geographic-nodes
).fi-resource-list-records-page .fi-ta-actions {
    color: var(--hes-chrome-text) !important;
}

/* Tickets overview stats follow sidebar chrome */

.fi-resource-tickets .fi-wi-stats-overview-stat {
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
    border: 1px solid var(--hes-card-border) !important;
    box-shadow: none !important;
    --tw-ring-shadow: 0 0 #0000 !important;
}

.fi-resource-tickets .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-label,
.fi-resource-tickets .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-value,
.fi-resource-tickets .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-description,
.fi-resource-tickets .fi-wi-stats-overview-stat .fi-icon {
    color: var(--hes-chrome-text) !important;
}

/* Device detail page surfaces follow sidebar chrome */

.hes-device-detail__status-badge,
.hes-device-detail-card--blue .hes-device-detail-card__header,
.hes-device-detail-card--red .hes-device-detail-card__header {
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
    border: 1px solid var(--hes-card-border) !important;
}

.hes-device-detail__cards--blue .hes-device-detail-card,
.hes-device-detail__cards--red .hes-device-detail-card,
.hes-device-detail__report {
    border: 1px solid var(--hes-card-border) !important;
}

.hes-device-detail__cards--blue .hes-device-detail-card__header,
.hes-device-detail__cards--red .hes-device-detail-card__header {
    border-bottom: 1px solid var(--hes-card-border) !important;
}

.hes-device-detail__date-filters input {
    border: 1px solid var(--hes-card-border) !important;
}

.hes-device-detail__tabs {
    border-bottom: 1px solid var(--hes-card-border) !important;
}

.hes-device-detail__last-update,
.hes-device-detail__section-title,
.hes-device-detail__report-header h3,
.hes-device-detail__date-filters label,
.hes-device-detail__tab,
.hes-device-detail-card__row span,
.hes-device-detail-card__event span,
.hes-device-detail-card__row strong,
.hes-device-detail-card__event strong,
.hes-device-detail-card__group-title,
.hes-device-detail__subscriber h4,
.hes-device-detail__subscriber dt,
.hes-device-detail__subscriber dd,
.hes-device-detail-chart__empty {
    color: var(--hes-chrome-text) !important;
}

.hes-device-detail-card,
.hes-device-detail-card__body,
.hes-device-detail__report,
.hes-device-detail__meter-image,
.hes-device-detail__subscriber,
.hes-device-detail__readings,
.hes-device-detail-map,
.hes-device-detail-chart__empty,
.hes-device-detail__date-filters input,
.hes-device-detail__action {
    background-color: var(--hes-chrome-bg) !important;
}

.hes-device-detail__meter-image,
.hes-device-detail__subscriber,
.hes-device-detail__readings,
.hes-device-detail-map,
.hes-device-detail-chart__empty,
.hes-device-detail__action {
    border-color: var(--hes-border) !important;
}

.hes-device-detail__date-filters input,
.hes-device-detail__action,
.hes-device-detail__readings {
    color: var(--hes-chrome-text) !important;
}

.hes-device-detail__tab.is-active {
    color: var(--hes-accent-active) !important;
    border-bottom-color: var(--hes-accent-active) !important;
}

.hes-device-detail__action.is-primary,
.hes-device-detail__action.is-danger,
.hes-device-detail__action.is-info {
    background-color: var(--hes-chrome-bg) !important;
    border-color: var(--hes-card-border) !important;
    color: var(--hes-chrome-text) !important;
}

.hes-chrome-modal.fi-modal-window,
.hes-chrome-modal.fi-modal-window .fi-modal-header,
.hes-chrome-modal.fi-modal-window .fi-modal-content,
.hes-chrome-modal.fi-modal-window .fi-modal-footer,
.hes-chrome-modal.fi-modal-window .fi-section,
.hes-chrome-modal.fi-modal-window .fi-sc-section,
.hes-chrome-modal.fi-modal-window .fi-fo-file-upload,
.hes-chrome-modal.fi-modal-window .fi-fo-textarea {
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
}

.hes-chrome-modal.fi-modal-window {
    border: 1px solid var(--hes-card-border) !important;
    box-shadow: none !important;
}

.hes-chrome-modal.fi-modal-window .fi-modal-heading,
.hes-chrome-modal.fi-modal-window .fi-modal-description,
.hes-chrome-modal.fi-modal-window .fi-section-header-heading,
.hes-chrome-modal.fi-modal-window .fi-section-header-description,
.hes-chrome-modal.fi-modal-window .fi-fo-field-wrp-label,
.hes-chrome-modal.fi-modal-window .fi-fo-field-wrp-label span,
.hes-chrome-modal.fi-modal-window .fi-fo-field-label-content,
.hes-chrome-modal.fi-modal-window label,
.hes-chrome-modal.fi-modal-window .fi-fieldset-legend {
    color: var(--hes-chrome-text) !important;
}

.hes-chrome-modal.fi-modal-window .fi-input-wrp {
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
    border: 1px solid var(--hes-card-border) !important;
    border-radius: 0.5rem !important;
    --tw-ring-color: transparent;
    --tw-ring-shadow: 0 0 #0000 !important;
    --tw-shadow: 0 0 #0000 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

.hes-chrome-modal.fi-modal-window .fi-input-wrp .fi-icon {
    color: var(--hes-chrome-text) !important;
}

.hes-chrome-modal.fi-modal-window .fi-input-wrp .fi-input-wrp-prefix:not(.fi-inline),
.hes-chrome-modal.fi-modal-window .fi-input-wrp .fi-input-wrp-suffix:not(.fi-inline) {
    border-color: var(--hes-card-border) !important;
}

.hes-chrome-modal.fi-modal-window .fi-select-input,
.hes-chrome-modal.fi-modal-window .fi-select-input-btn,
.hes-chrome-modal.fi-modal-window .fi-ta-ctn {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    color: var(--hes-chrome-text) !important;
}

.hes-chrome-modal.fi-modal-window .fi-select-input-btn {
    appearance: none !important;
    -webkit-appearance: none !important;
}

.hes-chrome-modal.fi-modal-window .fi-input,
.hes-chrome-modal.fi-modal-window input,
.hes-chrome-modal.fi-modal-window select,
.hes-chrome-modal.fi-modal-window textarea {
    color: var(--hes-chrome-text) !important;
}

.hes-chrome-modal.fi-modal-window .fi-input::placeholder,
.hes-chrome-modal.fi-modal-window textarea::placeholder {
    color: color-mix(in srgb, var(--hes-chrome-text) 55%, transparent) !important;
}

.hes-chrome-modal.fi-modal-window .fi-select-list,
.hes-chrome-modal.fi-modal-window .fi-dropdown-panel {
    background-color: var(--hes-chrome-bg) !important;
    border-color: var(--hes-card-border) !important;
    color: var(--hes-chrome-text) !important;
}

/* Ticket create + detail follow sidebar chrome in light/dark */

.fi-resource-tickets.fi-resource-create-record-page .fi-section,
.fi-resource-tickets.fi-resource-create-record-page .fi-sc-section,
.fi-resource-tickets.fi-resource-create-record-page .fi-input-wrp,
.fi-resource-tickets.fi-resource-create-record-page .fi-fo-file-upload,
.fi-resource-tickets.fi-resource-create-record-page .fi-fo-textarea,
.hes-ticket__main,
.hes-ticket__card,
.hes-ticket__composer {
    background-color: var(--hes-chrome-bg) !important;
    border-color: var(--hes-card-border) !important;
    color: var(--hes-chrome-text) !important;
    box-shadow: none !important;
}

.fi-resource-tickets.fi-resource-create-record-page .fi-input-wrp {
    border: 1px solid var(--hes-card-border) !important;
    border-radius: 0.5rem !important;
    --tw-ring-shadow: 0 0 #0000 !important;
    --tw-shadow: 0 0 #0000 !important;
    overflow: visible !important;
}

.fi-resource-tickets.fi-resource-create-record-page .fi-select-input,
.fi-resource-tickets.fi-resource-create-record-page .fi-select-input-btn {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    color: var(--hes-chrome-text) !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}

.fi-resource-tickets.fi-resource-create-record-page .fi-section-header-heading,
.fi-resource-tickets.fi-resource-create-record-page .fi-section-header-description,
.fi-resource-tickets.fi-resource-create-record-page .fi-fo-field-wrp-label,
.fi-resource-tickets.fi-resource-create-record-page .fi-fo-field-wrp-label span,
.fi-resource-tickets.fi-resource-create-record-page .fi-fo-field-label-content,
.fi-resource-tickets.fi-resource-create-record-page label,
.fi-resource-tickets.fi-resource-create-record-page .fi-input,
.fi-resource-tickets.fi-resource-create-record-page input,
.fi-resource-tickets.fi-resource-create-record-page select,
.fi-resource-tickets.fi-resource-create-record-page textarea,
.hes-ticket,
.hes-ticket__card h3,
.hes-ticket__info dt,
.hes-ticket__info dd,
.hes-ticket__thread-empty,
.hes-ticket__message-body,
.hes-ticket__bubble header,
.hes-ticket__bubble header strong,
.hes-ticket__composer-identity,
.hes-ticket__internal-toggle,
.hes-ticket__notes-hint,
.hes-ticket__note header,
.hes-ticket__note header strong,
.hes-ticket__dropzone {
    color: var(--hes-chrome-text) !important;
}

.fi-resource-tickets.fi-resource-create-record-page .fi-input::placeholder,
.fi-resource-tickets.fi-resource-create-record-page textarea::placeholder {
    color: color-mix(in srgb, var(--hes-chrome-text) 55%, transparent) !important;
}

.fi-resource-tickets.fi-resource-create-record-page .fi-dropdown-panel,
.fi-resource-tickets.fi-resource-create-record-page .fi-select-list {
    background-color: var(--hes-chrome-bg) !important;
    border-color: var(--hes-card-border) !important;
    color: var(--hes-chrome-text) !important;
}

.hes-ticket__composer,
.hes-ticket__dropzone,
.hes-ticket__note {
    border-color: var(--hes-border) !important;
}

.hes-ticket__dropzone {
    background-color: color-mix(in srgb, var(--hes-chrome-bg) 88%, #000) !important;
}

.hes-ticket__message.is-incoming .hes-ticket__bubble {
    background: color-mix(in srgb, var(--hes-chrome-text) 10%, var(--hes-chrome-bg)) !important;
}

.hes-ticket__message.is-outgoing .hes-ticket__bubble {
    background: color-mix(in srgb, var(--hes-accent-strong) 22%, var(--hes-chrome-bg)) !important;
}

.hes-ticket__chip,
.hes-ticket__composer-files span,
.hes-ticket__bubble-files a {
    background: color-mix(in srgb, var(--hes-chrome-text) 12%, var(--hes-chrome-bg)) !important;
    color: var(--hes-chrome-text) !important;
}

.hes-register-meters {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    color: var(--hes-chrome-text);
}

.hes-register-meters__row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.hes-register-meters__input {
    flex: 1 1 auto;
    border: 1px solid var(--hes-card-border) !important;
    border-radius: 0.625rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.875rem;
    direction: ltr;
    text-align: left;
    letter-spacing: 0.05em;
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
}

.hes-register-meters__input::placeholder {
    color: color-mix(in srgb, var(--hes-chrome-text) 55%, transparent);
}

.hes-register-meters__add {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid var(--hes-button-bg);
    border-radius: 0.625rem;
    background: var(--hes-button-bg);
    color: var(--hes-button-text);
    font-size: 1.25rem;
    font-weight: 700;
    cursor: pointer;
}

.hes-register-meters__add.is-disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.hes-register-meters__error {
    margin: 0;
    color: #dc2626;
    font-size: 0.8125rem;
}

.hes-register-meters__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.hes-register-meters__chip {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    border: 1px solid var(--hes-card-border);
    border-radius: 9999px;
    background-color: var(--hes-chrome-bg);
    padding: 0.375rem 0.625rem;
    direction: ltr;
}

.hes-register-meters__chip-id {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--hes-chrome-text);
}

.hes-register-meters__chip-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    border: none;
    border-radius: 9999px;
    background: #fee2e2;
    color: #dc2626;
    cursor: pointer;
}

.hes-register-meters__hint {
    margin: 0;
    color: var(--hes-chrome-text);
    font-size: 0.8125rem;
    opacity: 0.8;
}

.hes-register-meters__submit {
    width: 100%;
    border: 1px solid var(--hes-card-border);
    border-radius: 0.625rem;
    background-color: var(--hes-chrome-bg);
    color: var(--hes-chrome-text);
    padding: 0.75rem 1rem;
    font-size: 0.9375rem;
    font-weight: 700;
    cursor: pointer;
}

.hes-register-meters__submit.is-disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

/* Process management surfaces follow sidebar chrome */

.hes-process-management-card,
.hes-process-management-card__body,
.hes-process-management-queue,
.hes-process-management-queue__table th,
.hes-process-operator__value input,
.hes-process-operator__value select,
.hes-process-definition__form input,
.hes-process-definition__form select {
    background-color: var(--hes-chrome-bg) !important;
    border-color: var(--hes-card-border) !important;
    color: var(--hes-chrome-text) !important;
}

.hes-process-management-card {
    border: 1px solid var(--hes-card-border) !important;
}

.hes-process-management-card__header,
.hes-process-management-queue__header,
.hes-process-definition__header {
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
    border-bottom: 1px solid var(--hes-card-border) !important;
}

.hes-process-management__title,
.hes-process-operator__name,
.hes-process-operator__hint,
.hes-process-management-queue__table th,
.hes-process-management-queue__table td,
.hes-process-management-queue__empty,
.hes-process-management-queue__payload,
.hes-process-management-toggle__label,
.hes-process-definition__form label {
    color: var(--hes-chrome-text) !important;
}

.hes-process-management-queue {
    border: 1px solid var(--hes-card-border) !important;
}

.hes-process-management-queue__table th,
.hes-process-management-queue__table td {
    border-bottom-color: var(--hes-card-border) !important;
}

.hes-process-operator__select,
.hes-process-definition__create {
    background-color: var(--hes-chrome-bg) !important;
    border: 1px solid var(--hes-card-border) !important;
    color: var(--hes-chrome-text) !important;
}

.hes-process-management__refresh {
    color: var(--hes-chrome-text) !important;
    border-color: var(--hes-card-border) !important;
    background-color: var(--hes-chrome-bg) !important;
}

.hes-process-management__sidebar,
.hes-process-management__sidebar-image,
.hes-process-management__stats {
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
}

.hes-process-management__sidebar-image {
    border: 1px solid var(--hes-card-border) !important;
}

.hes-process-management__stats {
    padding: 0.875rem;
    border-radius: 0.75rem;
    border: 1px solid var(--hes-card-border) !important;
}

.hes-process-management__stats dt,
.hes-process-management__stats dd {
    color: var(--hes-chrome-text) !important;
}

.hes-process-completed__section,
.hes-process-completed__body,
.hes-process-completed__item {
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
}

.hes-process-completed__section {
    border: 1px solid var(--hes-card-border) !important;
}

.hes-process-completed__header {
    background-color: var(--hes-chrome-bg) !important;
    color: var(--hes-chrome-text) !important;
    border-bottom: 1px solid var(--hes-card-border) !important;
}

.hes-process-completed__item {
    border-bottom-color: var(--hes-card-border) !important;
}

.hes-process-completed__operator,
.hes-process-completed__meta dt,
.hes-process-completed__meta dd,
.hes-process-completed__empty,
.hes-process-completed__hint {
    color: var(--hes-chrome-text) !important;
}

.hes-device-detail-chart__frame,
.hes-dashboard-chart__frame {
    font-family: Vazir, sans-serif !important;
}

.hes-device-detail-chart .fi-wi-chart-grid-color,
.hes-dashboard-chart .fi-wi-chart-grid-color {
    color: rgba(17, 94, 89, 0.08) !important;
}

html.dark .hes-device-detail-chart .fi-wi-chart-grid-color,
html.dark .hes-dashboard-chart .fi-wi-chart-grid-color {
    color: rgba(204, 251, 241, 0.08) !important;
}

.hes-device-detail-chart .fi-wi-chart-text-color,
.hes-dashboard-chart .fi-wi-chart-text-color {
    color: var(--hes-chrome-text) !important;
}

.hes-dashboard-map__modal {
    background-color: var(--hes-chrome-bg) !important;
    border-color: var(--hes-card-border) !important;
    color: var(--hes-chrome-text) !important;
    box-shadow: none !important;
}

.hes-dashboard-map__modal-header {
    background-color: var(--hes-chrome-bg) !important;
    border-bottom-color: var(--hes-card-border) !important;
}

.hes-dashboard-map__modal-header h3,
.hes-dashboard-map__modal-close,
.hes-dashboard-map__modal-body dt,
.hes-dashboard-map__modal-body dd {
    color: var(--hes-chrome-text) !important;
}

.hes-meter-card,
.fi-resource-devices .fi-ta-record:has(.hes-meter-card) {
    background-color: var(--hes-chrome-bg) !important;
    border-color: var(--hes-border) !important;
    color: var(--hes-chrome-text) !important;
}

.hes-meter-card__body,
.hes-meter-card__image {
    background-color: var(--hes-chrome-bg) !important;
}

.hes-meter-card__label,
.hes-meter-card__value,
.hes-meter-card__image-fallback {
    color: var(--hes-chrome-text) !important;
}

.hes-meter-card__action:not(.is-primary):not(.is-danger):not(.is-warning) {
    background-color: color-mix(in srgb, var(--hes-chrome-text) 10%, var(--hes-chrome-bg)) !important;
    border-color: var(--hes-border) !important;
    color: var(--hes-chrome-text) !important;
}

/* User menu */

.hes-user-menu__organization {
    margin: -0.35rem 0 0;
    padding: 0 0.75rem 0.75rem;
    font-size: 0.8125rem;
    line-height: 1.4;
    color: var(--hes-muted);
}

html.dark .hes-user-menu__organization,
html.dark .fi-dropdown-header,
html.dark .fi-dropdown-list-item-label {
    color: var(--hes-accent) !important;
}

.fi-user-menu .fi-dropdown-panel,
.fi-dropdown-panel:has(.fi-theme-switcher),
.fi-dropdown-panel:has(.hes-user-menu__organization) {
    background-color: var(--hes-content-bg);
    border-color: var(--hes-border);
}

.fi-theme-switcher {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
    width: 100%;
    padding-block: 0.35rem;
}

.fi-theme-switcher::before {
    content: "حالت روز و شب";
    margin-inline-end: auto;
    font-size: 0.875rem;
    color: var(--hes-text);
}

html.dark .fi-theme-switcher::before {
    color: var(--hes-accent);
}

.fi-theme-switcher-btn[theme="system"],
.fi-theme-switcher-btn:nth-child(3) {
    display: none !important;
}

.fi-theme-switcher-btn.fi-active {
    background-color: var(--hes-accent-active) !important;
    color: #fff !important;
}

html.dark .fi-theme-switcher-btn.fi-active {
    color: var(--hes-accent) !important;
}

/*
 * Status badges, connection pills, and quality meters keep their original colors.
 * Do not add color/background rules for:
 * .hes-meter-card__badge, .fi-badge, .hes-ticket-badge, .hes-ticket__pill,
 * .hes-meter-card__quality-segment
 */