@media screen {
    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }

    body:not(.page-login) aside {
        width: 218px !important;
        padding: 10px 7px !important;
        gap: 6px !important;
    }

    body:not(.page-login) main {
        margin-left: 218px !important;
        min-width: 0 !important;
        max-width: calc(100vw - 218px) !important;
        overflow: hidden !important;
    }

    body:not(.page-login) header {
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 10px !important;
    }

    body:not(.page-login) header strong {
        font-size: 14px !important;
        line-height: 1.05 !important;
    }

    body:not(.page-login) header span {
        margin-top: 1px !important;
        font-size: 9px !important;
        line-height: 1.1 !important;
    }

    body:not(.page-login) .brand {
        padding: 0 7px 7px !important;
        font-size: 16px !important;
    }

    body:not(.page-login) .brand small,
    body:not(.page-login) .brand em {
        margin-top: 3px !important;
        font-size: 8px !important;
    }

    body:not(.page-login) aside nav a {
        min-height: 28px !important;
        padding: 5px 7px !important;
        gap: 6px !important;
        font-size: 11px !important;
    }

    body:not(.page-login) aside nav a svg {
        width: 13px !important;
        height: 13px !important;
        min-width: 13px !important;
        max-width: 13px !important;
        flex-basis: 13px !important;
    }

    body:not(.page-login) aside button {
        min-height: 28px !important;
        font-size: 11px !important;
    }

    .flash,
    .error {
        margin: 5px 6px 0 !important;
        padding: 4px 7px !important;
        border-radius: 4px !important;
        font-size: 10px !important;
    }

    .panel,
    .empresa-form-panel {
        margin: 5px 6px !important;
        padding: 6px 7px !important;
        border-radius: 5px !important;
        overflow-x: hidden !important;
    }

    .panel h2 {
        margin-bottom: 5px !important;
        font-size: 12px !important;
        line-height: 1.08 !important;
    }

    .cards {
        padding: 6px 6px 0 !important;
        gap: 6px !important;
        grid-template-columns: repeat(auto-fit, minmax(105px, 1fr)) !important;
    }

    .cards article {
        padding: 7px 8px !important;
        border-radius: 5px !important;
    }

    .cards span {
        min-height: 0 !important;
        font-size: 8px !important;
        line-height: 1.1 !important;
    }

    .cards strong {
        margin-top: 3px !important;
        font-size: 16px !important;
        line-height: 1.05 !important;
        white-space: normal !important;
    }

    .grid-form,
    .page-empresa .empresa-form-panel .grid-form,
    .page-empresas .empresa-form-panel .grid-form,
    .page-autefs .grid-form,
    .page-usuarios .grid-form,
    .page-auditoria .auditoria-filter-form,
    .page-relatorios .grid-form,
    .page-toras .grid-form,
    .page-transformacao .transformacao-form,
    .page-transformacao .transformacao-percentual-form,
    .page-baixaitoras .baixar-toolbar {
        width: 100% !important;
        min-width: 0 !important;
        grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)) !important;
        gap: 5px !important;
    }

    .wide,
    .scientific-name,
    .page-empresa .wide,
    .page-empresas .wide,
    .page-autefs .wide {
        grid-column: auto !important;
    }

    label {
        gap: 2px !important;
        font-size: 9px !important;
        line-height: 1 !important;
    }

    input,
    textarea,
    select {
        min-height: 24px !important;
        padding: 3px 5px !important;
        border-radius: 4px !important;
        font-size: 11px !important;
        line-height: 1.1 !important;
    }

    textarea {
        min-height: 34px !important;
    }

    button,
    .filter-button,
    .clear-filter-button,
    .print-report-button,
    .download-installer-button,
    .icon-button,
    .relatorios-action-button,
    .transformacao-action-button,
    .transformacao-link-button {
        width: auto;
        min-width: 0 !important;
        min-height: 24px !important;
        height: auto !important;
        padding: 4px 6px !important;
        border-radius: 4px !important;
        font-size: 9px !important;
        line-height: 1.05 !important;
        box-shadow: none !important;
        white-space: normal !important;
    }

    .page-transformacao .transformacao-action-button,
    .page-baixaitoras .icon-button,
    .page-relatorios .relatorios-action-button {
        width: 100% !important;
    }

    .page-transformacao .transformacao-action-button svg,
    .page-baixaitoras .icon-button svg {
        width: 11px !important;
        height: 11px !important;
    }

    table {
        width: 100% !important;
        min-width: 0 !important;
        border-collapse: collapse !important;
        table-layout: fixed !important;
        font-size: 9px !important;
        line-height: 1.05 !important;
    }

    th,
    td {
        max-width: 170px !important;
        padding: 2px 3px !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
        text-overflow: clip !important;
        vertical-align: top !important;
    }

    th {
        font-size: 8px !important;
        line-height: 1.05 !important;
        letter-spacing: 0 !important;
    }

    td {
        font-size: 9px !important;
    }

    .link-button {
        width: auto !important;
        min-height: 0 !important;
        padding: 0 !important;
        font-size: 9px !important;
    }

    .page-baixaitoras output {
        grid-column: 1 / -1 !important;
        min-height: 24px !important;
        padding: 4px 6px !important;
        white-space: normal !important;
        font-size: 10px !important;
    }

    .page-importacao #import-form {
        display: grid !important;
        grid-template-columns: minmax(160px, 1fr) 70px 70px 70px !important;
    }

    .page-importacao #import-button,
    .page-importacao #import-layout-button,
    .page-importacao #import-show-button {
        width: auto !important;
        min-width: 0 !important;
        min-height: 24px !important;
        padding: 4px 5px !important;
        font-size: 9px !important;
    }

    .page-transformacao_tabela .transformacao-percentual-form {
        grid-template-columns: minmax(96px, .75fr) minmax(145px, .9fr) 68px 68px 76px 68px 64px !important;
    }

    .page-transformacao_tabela .transformacao-percentual-form button,
    .page-transformacao_tabela .transformacao-percentual-form .transformacao-link-button {
        width: 100% !important;
        white-space: nowrap !important;
    }

    .page-transformacao .transformacao-filter-panel {
        overflow-x: auto !important;
    }

    .page-transformacao .transformacao-form {
        width: max-content !important;
        min-width: 1180px !important;
        grid-template-columns: 150px 195px 210px 255px 135px 105px 82px !important;
    }
}

@media screen and (max-width: 980px) {
    body:not(.page-login) main {
        max-width: 100vw !important;
        margin-left: 0 !important;
    }

    body:not(.page-login) header {
        min-height: 42px !important;
    }
}
