/* Platform administration — reuses Durin's shared design system as-is. */

/* ---------- Nav: future/unbuilt sections ----------
   MudBlazor's own .mud-nav-link-disabled rule uses --mud-palette-text-disabled,
   a dark grey meant for light surfaces — nearly invisible on the dark drawer.
   Repaint disabled admin nav links in the same light drawer tone as the
   tenant nav, just dimmed to still read as "not yet available". */

.side-nav .mud-nav-link.mud-nav-link-disabled {
    color: var(--tm-drawer-text) !important;
    opacity: 0.55;
}

.side-nav .mud-nav-link.mud-nav-link-disabled .mud-nav-link-icon {
    color: var(--tm-drawer-text) !important;
}

/* ---------- Shared admin form (Novo Tenant, Cadastrar Equipamento, etc.) ---------- */

.platform-admin-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    min-width: 520px;
    padding-top: 6px;
}

.platform-admin-form-full {
    grid-column: 1 / -1;
}

@media (max-width: 599px) {
    .platform-admin-form-grid {
        grid-template-columns: 1fr;
        min-width: 0;
    }

    .platform-admin-form-full {
        grid-column: auto;
    }
}

/* ---------- Audit log detail (JSON old/new values) ---------- */

.audit-json-block {
    margin: 4px 0 0;
    padding: 12px;
    background-color: var(--tm-bg);
    border: 1px solid var(--tm-border);
    border-radius: 8px;
    /* Era 'Barlow Condensed', monospace — a fonte condensada e PROPORCIONAL vencia, e o
       `monospace` do fim nunca chegava a ser usado. Num dump de JSON isso desalinhava
       indentação, chaves e colunas de dígitos, que é justamente o que se lê aqui. */
    font-family: var(--font-code);
    font-variant-numeric: tabular-nums;
    font-size: 13px;
    line-height: 1.5;
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 320px;
    overflow-y: auto;
}

/* ---------- Tabela de Integradores ----------
   Seis colunas repartindo o painel. O comportamento (layout fixo, truncagem, chips que encolhem)
   vem do kit .dash-table-fixed em dashboard.css; aqui ficam só as larguras desta listagem.
   Escopado em .integradores-table para .dash-table seguir idêntica nas demais páginas. */

@media (min-width: 600px) {
    /* 1 Integrador · 2 Carteira · 3 Acesso · 4 Status · 5 Cadastro · 6 Ações */
    .integradores-table th:nth-child(1),
    .integradores-table td:nth-child(1) {
        width: 33%;
    }

    .integradores-table th:nth-child(2),
    .integradores-table td:nth-child(2) {
        width: 12%;
    }

    .integradores-table th:nth-child(3),
    .integradores-table td:nth-child(3) {
        width: 16.5%;
    }

    .integradores-table th:nth-child(4),
    .integradores-table td:nth-child(4) {
        width: 11.5%;
    }

    .integradores-table th:nth-child(5),
    .integradores-table td:nth-child(5) {
        width: 12.5%;
    }

    .integradores-table th:nth-child(6),
    .integradores-table td:nth-child(6) {
        width: 14.5%;
    }
}

/* ---------- Auditoria global (/admin/auditoria) ----------
   O comportamento da tabela (layout fixo, truncagem, chips que encolhem) vem do kit
   .dash-table-fixed em dashboard.css; aqui ficam só as larguras desta listagem, as pilhas de
   conteúdo e a quebra segura de uuid/e-mail/user-agent. Nenhum sistema novo de cards ou chips. */

.audit-snapshot-stamp {
    align-self: flex-end;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Duas linhas por célula: o dado que identifica em cima, o secundário abaixo. Mesma ideia da
   coluna de SKU em /movimentacoes. */
.audit-stack-cell,
.audit-when-cell {
    min-width: 0;
}

.audit-stack-primary,
.audit-stack-secondary,
.audit-when-date,
.audit-when-time {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.audit-stack-secondary,
.audit-when-time {
    font-size: 0.8em;
    opacity: 0.72;
}

.audit-when-date,
.audit-when-time {
    font-variant-numeric: tabular-nums;
}

@media (min-width: 600px) {
    /* 1 Data · 2 Trilha · 3 Contexto · 4 Ator · 5 Evento · 6 Resultado · 7 Detalhes */
    .audit-table th:nth-child(1),
    .audit-table td:nth-child(1) {
        width: 11%;
    }

    .audit-table th:nth-child(2),
    .audit-table td:nth-child(2) {
        width: 12%;
    }

    .audit-table th:nth-child(3),
    .audit-table td:nth-child(3) {
        width: 17%;
    }

    .audit-table th:nth-child(4),
    .audit-table td:nth-child(4) {
        width: 18%;
    }

    .audit-table th:nth-child(5),
    .audit-table td:nth-child(5) {
        width: 27%;
    }

    .audit-table th:nth-child(6),
    .audit-table td:nth-child(6) {
        width: 9%;
    }

    .audit-table th:nth-child(7),
    .audit-table td:nth-child(7) {
        width: 6%;
    }
}

/* Abaixo de 600px o MudTable vira lista rotulada pelos DataLabel: a truncagem de uma linha só
   passa a esconder informação em vez de organizá-la, então o texto volta a quebrar. */
@media (max-width: 599px) {
    .audit-snapshot-stamp {
        align-self: flex-start;
        white-space: normal;
    }

    .audit-stack-primary,
    .audit-stack-secondary,
    .audit-when-date,
    .audit-when-time {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
        word-break: break-word;
    }

    .audit-when-cell .audit-when-date,
    .audit-when-cell .audit-when-time {
        display: inline;
    }

    .audit-when-cell .audit-when-time::before {
        content: " ";
    }
}

/* ---------- Grade de fatos do diálogo de detalhe ---------- */

.audit-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
    padding-top: 6px;
}

.audit-detail-fact {
    min-width: 0;
}

.audit-detail-fact-wide {
    grid-column: 1 / -1;
}

.audit-detail-value {
    display: block;
    margin-top: 2px;
    font-size: 0.95rem;
}

/* Um uuid, um e-mail e um user-agent não têm espaço onde quebrar: sem isto eles esticam a grade
   e empurram a coluna vizinha para fora do diálogo. */
.audit-detail-break {
    overflow-wrap: anywhere;
    word-break: break-word;
}

@media (max-width: 599px) {
    .audit-detail-grid {
        grid-template-columns: 1fr;
    }

    .audit-detail-fact-wide {
        grid-column: auto;
    }
}

/* ---------- Extensões do cliente ---------- */

/* A linha é "informação à esquerda, interruptor à direita" e precisa continuar assim quando o nome
   da extensão é longo: por isso o bloco de texto pode encolher (min-width: 0) e o interruptor não. */
.ext-admin-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
}

.ext-admin-info {
    min-width: 0;
}

.ext-admin-heading {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.ext-admin-description {
    margin-top: 2px;
    opacity: 0.85;
}

.ext-admin-meta {
    display: block;
    margin-top: 4px;
    opacity: 0.7;
}

.ext-admin-switch {
    flex: 0 0 auto;
    padding-top: 2px;
}

@media (max-width: 599px) {
    .ext-admin-row {
        flex-direction: column;
        gap: 8px;
    }
}

/* ---------------------------------------------------------------------------------------------
   Teste e manutenção de equipamentos (/admin/maquinas/{id}/hardware).
   Aditivo: a anatomia (dashboard-header, panel-card, dash-table, empty-state) vem de
   dashboard.css. Aqui só existe o que é próprio desta página.
   --------------------------------------------------------------------------------------------- */

/* Estado global do equipamento: o mesmo indicador do terminal, acima dos cartões técnicos. */
.hardware-equipment-state {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 12px;
}

.hardware-status-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.hardware-status-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
    padding: 0.9rem 1rem;
}

.hardware-status-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    font-size: 0.78rem;
    color: var(--mud-palette-text-secondary);
}

/* Aba Estado do equipamento: a faixa operacional (impedimentos; reserva, comando e ações) vem
   ANTES da tabela, que ocupa a largura toda logo abaixo. Motivos e ações ficam lado a lado só
   quando cada metade tem 340px; antes disso empilham. Conteúdo normal da página, nunca por cima
   da tabela. */
.hardware-operations-band {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
    gap: 1rem 1.25rem;
    align-items: start;
    margin-bottom: 1.5rem;
}

.hardware-operations-band > * {
    min-width: 0;
}

.hardware-operations-actions {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* ---------- Recursos e leituras (HardwareResourceTable) ----------
   Sem rolagem horizontal porque o conteúdo CABE, não porque o excedente foi escondido: layout
   fixo em 100% e quebra de linha. Nada de reticências, altura fixa ou overflow oculto — todo valor
   aparece inteiro. O kit .dash-table impõe `white-space: nowrap` com (0,3,0); os seletores daqui
   têm (0,4,0) e valem só nesta tabela. O .dash-table-fixed NÃO serve: ele trunca. */
.hardware-resources-host {
    container: hardware-resources / inline-size;
}

.hardware-resource-table .mud-table-root {
    table-layout: fixed;
}

.dash-table.hardware-resource-table .mud-table-head .mud-table-cell,
.dash-table.hardware-resource-table .mud-table-body .mud-table-cell {
    white-space: normal;
    overflow-wrap: break-word;
    vertical-align: top;
    padding-left: 10px;
    padding-right: 10px;
    padding-inline-start: 10px;
    padding-inline-end: 10px;
}

/* Canal e nomes longos quebram em qualquer ponto, sem inserir caracteres no valor copiado. */
.hardware-resource-value {
    min-width: 0;
    overflow-wrap: anywhere;
}

/* Uma posição (com a vírgula) só se parte quando sozinha não cabe na linha. */
.hardware-resource-position {
    display: inline-block;
    max-width: 100%;
}

.hardware-resource-table .mud-chip.mud-chip-size-small {
    height: auto;
    min-height: 24px;
    margin: 0 0 2px;
    padding-top: 3px;
    padding-bottom: 3px;
    line-height: 1.3;
    white-space: normal;
    text-align: start;
}

.hardware-resource-table .mud-chip .mud-chip-content {
    min-width: 0;
    overflow-wrap: anywhere;
}

/* Larguras medidas no navegador (11/10/2026) pela maior palavra de cada coluna, sem partir palavra:
   Recurso 81px (o cabeçalho), Canal 64, Posições 112 ("compartilhada"), Porta/Trava/Atuador 110
   ("Desconhecida"), Leitura 88 — já com os 20px de recuo. O limite de empilhamento de cada conjunto
   é a maior razão palavra/fração mais uma folga: abaixo dele a tabela partiria palavras ao meio.

   Sete colunas (composto, rotativo e construção desconhecida): cabem a partir de 786px. */
.hardware-resource-table .hardware-col-resource { width: 11%; }
.hardware-resource-table .hardware-col-channel { width: 13%; }
.hardware-resource-table .hardware-col-positions { width: 19%; }
.hardware-resource-table .hardware-col-door { width: 14%; }
.hardware-resource-table .hardware-col-lock { width: 14%; }
.hardware-resource-table .hardware-col-actuator { width: 14%; }
.hardware-resource-table .hardware-col-reading { width: 15%; }

/* Cinco colunas (gaveteiro simples, sem Trava e Atuador): cabem a partir de 611px. */
.hardware-resource-table--simple .hardware-col-resource { width: 15%; }
.hardware-resource-table--simple .hardware-col-channel { width: 17%; }
.hardware-resource-table--simple .hardware-col-positions { width: 27%; }
.hardware-resource-table--simple .hardware-col-door { width: 18%; }
.hardware-resource-table--simple .hardware-col-reading { width: 23%; }

/* Área estreita: cada recurso vira um bloco de rótulo + valor. Decide a largura do CONTÊINER, não
   a da janela, para o menu lateral e o zoom entrarem na conta. É o único empilhamento desta
   tabela — o do MudTable está desligado (Breakpoint.None). Os dois blocos têm o MESMO corpo e só
   diferem no limite: 820px para as sete colunas, 640px para as cinco do gaveteiro simples. */
@container hardware-resources (max-width: 820px) {
    .hardware-resource-table:where(:not(.hardware-resource-table--simple)) .mud-table-root,
    .hardware-resource-table:where(:not(.hardware-resource-table--simple)) .mud-table-body,
    .hardware-resource-table:where(:not(.hardware-resource-table--simple)) .mud-table-body .mud-table-row {
        display: block;
        width: 100%;
    }

    .hardware-resource-table:where(:not(.hardware-resource-table--simple)) .mud-table-root colgroup,
    .hardware-resource-table:where(:not(.hardware-resource-table--simple)) .mud-table-head {
        display: none;
    }

    .hardware-resource-table:where(:not(.hardware-resource-table--simple)) .mud-table-body .mud-table-row {
        padding: 6px 0;
        border-bottom: 1px solid var(--tm-border);
    }

    .hardware-resource-table:where(:not(.hardware-resource-table--simple)) .mud-table-body .mud-table-row:last-child {
        border-bottom: none;
    }

    .dash-table.hardware-resource-table:where(:not(.hardware-resource-table--simple)) .mud-table-body .mud-table-cell[data-label] {
        display: grid;
        grid-template-columns: minmax(7.5rem, 32%) minmax(0, 1fr);
        column-gap: 12px;
        align-items: start;
        padding: 4px 16px;
        border-bottom: none;
    }

    /* Família e espaçamento reancorados: o pseudo herda da célula. */
    .dash-table.hardware-resource-table:where(:not(.hardware-resource-table--simple)) .mud-table-body .mud-table-cell[data-label]::before {
        content: attr(data-label);
        font-family: var(--font-body);
        font-size: var(--type-table-header);
        font-weight: 600;
        letter-spacing: normal;
        color: var(--tm-text-muted);
        overflow-wrap: break-word;
    }
}

@container hardware-resources (max-width: 640px) {
    .hardware-resource-table .mud-table-root,
    .hardware-resource-table .mud-table-body,
    .hardware-resource-table .mud-table-body .mud-table-row {
        display: block;
        width: 100%;
    }

    .hardware-resource-table .mud-table-root colgroup,
    .hardware-resource-table .mud-table-head {
        display: none;
    }

    .hardware-resource-table .mud-table-body .mud-table-row {
        padding: 6px 0;
        border-bottom: 1px solid var(--tm-border);
    }

    .hardware-resource-table .mud-table-body .mud-table-row:last-child {
        border-bottom: none;
    }

    .dash-table.hardware-resource-table .mud-table-body .mud-table-cell[data-label] {
        display: grid;
        grid-template-columns: minmax(7.5rem, 32%) minmax(0, 1fr);
        column-gap: 12px;
        align-items: start;
        padding: 4px 16px;
        border-bottom: none;
    }

    /* Família e espaçamento reancorados: o pseudo herda da célula. */
    .dash-table.hardware-resource-table .mud-table-body .mud-table-cell[data-label]::before {
        content: attr(data-label);
        font-family: var(--font-body);
        font-size: var(--type-table-header);
        font-weight: 600;
        letter-spacing: normal;
        color: var(--tm-text-muted);
        overflow-wrap: break-word;
    }
}

/* Muito estreito (celular, zoom alto): o rótulo sobe para a linha de cima do valor. */
@container hardware-resources (max-width: 420px) {
    .dash-table.hardware-resource-table .mud-table-body .mud-table-cell[data-label] {
        grid-template-columns: minmax(0, 1fr);
        row-gap: 2px;
    }
}

.hardware-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
    margin-bottom: 1rem;
}

.hardware-position-select {
    max-width: 420px;
}

.hardware-reasons .mud-list-item {
    padding-left: 0;
}

/* Código cru do impedimento (e o rótulo de um código sem tradução, que é o próprio código): longo
   e sem espaços, quebra em vez de alargar a faixa. */
.hardware-reasons .mud-list-item-text {
    overflow-wrap: anywhere;
}

/* Tabela chave/valor da configuração e do detalhe do comando. */
.hardware-kv th {
    width: 38%;
    font-weight: 500;
    color: var(--mud-palette-text-secondary);
    vertical-align: top;
}

.hardware-kv td {
    word-break: break-word;
}

.hardware-command-detail .hardware-kv {
    margin-bottom: 0.5rem;
}

/* Frente da máquina (PhysicalFrontLayoutDialog, migration 20261014110000). A prévia usa as classes do
   terminal guiado (terminal-guided.css) para ser o mesmo desenho que o operador vê. */
.physical-front-toolbar,
.physical-front-grid-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    margin-bottom: 12px;
}

.physical-front-toolbar .mud-select {
    max-width: 220px;
}

.physical-front-grid-controls > * {
    flex: 1 1 150px;
}

.physical-front-body {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

.physical-front-table {
    max-height: 56vh;
    overflow: auto;
}

.physical-front-table tr {
    cursor: pointer;
}

.physical-front-row-selected td {
    background: var(--tm-primary-tint, #FDEAE1);
}

.physical-front-table .mud-input-control {
    margin-top: 0;
    min-width: 64px;
}

.physical-front-preview .terminal-guided-cabinet {
    display: block;
    width: 100%;
    max-height: 52vh;
}

.physical-front-identity {
    display: grid;
    gap: 2px;
    margin-top: 10px;
    padding: 10px 12px;
    border-left: 3px solid var(--tm-primary, #F15A24);
    background: var(--tm-primary-tint, #FDEAE1);
    font-size: 14px;
}

@media (max-width: 900px) {
    .physical-front-body {
        grid-template-columns: 1fr;
    }
}