.mud-table-head th {
    background-color: var(--mud-palette-info-lighten);
    color: var(--mud-palette-primary-text);
}

/* Comparação de configuração: colore apenas o cabeçalho da aba (nunca o painel,
   evitando o "pilar" vermelho na barra de rolagem do conteúdo). */
.mud-tabs .mud-tab.tab-config-alterado {
    background-color: rgba(244, 67, 54, 0.15);
    padding-right: 22px;
}

.mud-tabs .mud-tab.tab-config-igual {
    background-color: rgba(76, 175, 80, 0.15);
}

.mud-button-filled.mud-button-filled-warning {
    color: white !important;
    background-color: #FF9800 !important;
    --mud-ripple-color: white !important;
}

.mud-button-filled.mud-button-filled-success {
    color: white !important;
    --mud-ripple-color: white !important;
    background-color: #00a344 !important;
}

.mud-data-grid .mud-table-cell .column-header .sortable-column-header {
    width: 100%;
}

.apexcharts-tooltip.meu-tooltip {
    transform: translateY(20rem) !important;
}

.mud-data-grid .mud-table-cell .column-header {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px;
}

.mud-data-grid .mud-icon-button.sort-direction-icon {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    color: var(--mud-palette-info-darken) !important;
}

    .mud-data-grid .mud-icon-button.sort-direction-icon.mud-direction-asc,
    .mud-data-grid .mud-icon-button.sort-direction-icon.mud-direction-desc {
        color: var(--mud-palette-info-darken) !important;
    }


.mud-typography {
    font-family: 'Roboto', sans-serif !important;
}

body, button, input, select, textarea {
    font-family: 'Roboto', sans-serif !important;
}

.mud-typography.mud-typography-body2.mud-table-pagination-caption {
    font-weight: bold;
}

.mud-card-header {
    background-color: var(--mud-palette-info-lighten);
}

.mud-button-root.mud-icon-button.mud-ripple.mud-ripple-icon.mud-flip-x-rtl {
    color: var(--mud-palette-info-darken);
}

.mud-table-cell {
    padding: 8px 12px;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: 'Roboto', sans-serif;
    font-size: 0.9rem;
    color: var(--mud-palette-text-primary);
    user-select: text;
}

@media (max-width: 1920px) {
    html {
        font-size: 14px;
    }
}

@media (max-width: 1680px) {
    html {
        font-size: 13px; 
    }
}

@media (max-width: 1480px) {
    html {
        font-size: 12px;  
    }
}

@media (max-width: 600px) {
    .mud-xs-table .mud-table-cell:before {
        font-weight: bold;
    }

    .swal2-container.swal2-backdrop-show {
        backdrop-filter: blur(10px) saturate(180%) !important;
        -webkit-backdrop-filter: blur(10px) saturate(180%) !important;
        background-color: rgba(17, 25, 40, 0.45) !important;
    }

    /* Botão da empresa na AppBar: fonte menor no celular para não quebrar em
       duas linhas e estourar a altura da barra (o que cortava a borda). */
    .appbar-empresa {
        font-size: 0.68rem !important;
        padding: 2px 6px !important;
        min-width: 0 !important;
        max-width: 42vw;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

        .appbar-empresa .mud-button-label {
            overflow: hidden;
            text-overflow: ellipsis;
        }

    /* No celular mostra só o nome da empresa, sem o prefixo "Empresa:". */
    .appbar-empresa .empresa-prefixo {
        display: none;
    }
}

 
:root {
    /* Campo readonly/desabilitado um pouco mais escuro */
    --propack-campo-bloqueado-bg: rgba(0, 0, 0, 0.11);
    /* Bordas das inputbox pretas */
    --mud-palette-lines-inputs: #000000;
}

.mud-theme-dark {
    --propack-campo-bloqueado-bg: rgba(255, 255, 255, 0.10);
    /* No tema escuro mantém uma borda clara para continuar visível */
    --mud-palette-lines-inputs: rgba(255, 255, 255, 0.75);
}

/* ==== Ajustes globais dos formulários ==== */
/* Aplicado apenas em telas grandes (>= 1280px). Abaixo disso mantém o
   padrão do MudBlazor para não quebrar o layout no celular/tablet. */
@media (min-width: 1280px) {

/* Espaçamento horizontal (entre colunas) e vertical (entre linhas) */
.mud-input-control {
    box-sizing: border-box;
    margin-top: 2px;
    margin-bottom: 12px;
    padding-left: 10px;
    padding-right: 10px;
}

/* Label fixo no topo da coluna do campo */
.mud-input-control label.mud-input-label-inputcontrol {
    order: -1;
    position: static !important;
    transform: none !important;
    transform-origin: initial !important;
    max-width: 100% !important;
    margin-bottom: 4px;
    padding: 0 !important;
    font-size: 0.95rem !important;
    font-weight: 500;
    line-height: 1.2 !important;
    color: var(--mud-palette-text-primary) !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    pointer-events: auto;
}

/* Cor do label destacada quando o campo está em foco */
.mud-input-control:focus-within label.mud-input-label-inputcontrol {
    color: var(--mud-palette-primary) !important;
}

/* Borda de cima sempre contínua (sem o "entalhe" do label flutuante) */
.mud-input.mud-input-outlined > .mud-input-outlined-border legend {
    width: 0 !important;
    max-width: 0 !important;
    padding: 0 !important;
}

/* Aproxima a primeira linha de campos do cabeçalho de seção (card azul).
   Ajuste o valor para mais/menos espaço. */
.mud-grid .mud-paper.d-flex.p-2.mb-2 {
    margin-bottom: -6px !important;
}

/* Borda da inputbox PRETA no estado normal.
   Preserva azul no foco, vermelho no erro e cinza no desabilitado. */
.mud-input.mud-input-outlined:not(:focus-within):not(.mud-input-error):not(.mud-disabled) > .mud-input-outlined-border {
    border-color: #4d4d4d !important;
}

.mud-theme-dark .mud-input.mud-input-outlined:not(:focus-within):not(.mud-input-error):not(.mud-disabled) > .mud-input-outlined-border {
    border-color: rgba(255, 255, 255, 0.75) !important;
}

} /* fim @media (min-width: 1280px) — redesign dos formulários */

.mud-input.mud-disabled,
.mud-input:not(.mud-select-input):has(input[readonly]),
.mud-input:not(.mud-select-input):has(textarea[readonly]) {
    background-color: var(--propack-campo-bloqueado-bg);
    border-radius: var(--mud-default-borderradius, 4px);
}

.mud-picker .mud-input:not(.mud-disabled) {
    background-color: transparent;
}

.mud-input.mud-disabled,
.mud-input-label-inputcontrol.mud-disabled {
    color: var(--mud-palette-text-primary);
}

.mud-input.mud-disabled .mud-input-slot,
.mud-input.mud-disabled input:disabled,
.mud-input.mud-disabled textarea:disabled {
    color: var(--mud-palette-text-primary);
    -webkit-text-fill-color: var(--mud-palette-text-primary);
    opacity: 1;
}