/**
 * Shell visual padrão (listagens / hubs) — alinhado a ListarUsuarios.
 * Classes globais para reutilização em qualquer página.
 */

.usuario-list-page {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.usuario-list-page__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.usuario-list-page__header-left {
    flex: 1;
    min-width: 0;
}

.usuario-list-page__header-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.usuario-list-breadcrumb {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin-bottom: 0.85rem;
    color: #6e6b7b;
    font-size: 0.92rem;
    flex-wrap: wrap;
}

.usuario-list-breadcrumb__icon {
    width: 1rem;
    height: 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.usuario-list-breadcrumb__icon svg {
    width: 1rem;
    height: 1rem;
}

.usuario-list-breadcrumb__separator {
    color: #b9b9c3;
}

.usuario-list-breadcrumb__item--current {
    color: #5e5873;
    font-weight: 600;
}

.usuario-list-page__title-wrap {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.usuario-list-page__title-icon {
    width: 4rem;
    height: 4rem;
    border-radius: 0.85rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f3f2f7;
    color: #7367f0;
    flex-shrink: 0;
}

.usuario-list-page__title-icon svg {
    width: 2rem;
    height: 2rem;
}

.usuario-list-page__title {
    margin: 0;
    color: #5e5873;
    font-size: 1.85rem;
    font-weight: 700;
}

.usuario-list-page__subtitle {
    margin: 0.35rem 0 0;
    color: #6e6b7b;
}

/**
 * Cartões de página — padrão do sistema (sombras em camadas + hover).
 * Inclui listagens (*-list-card), formulários (*-card) e blocos equivalentes.
 */
:is(
    .usuario-list-card,
    .usuario-card,
    .governo-list-card,
    .secretaria-list-card,
    .controle-acesso-list-card,
    .departamento-list-card,
    .categoria-list-card,
    .area-list-card,
    .unidade-list-card,
    .assunto-list-card,
    .categoria-card,
    .vinculo-unidade-card,
    .classificacao-card,
    .controle-acesso-menu-section,
    .mapa-regional-card,
    .controle-acesso-card,
    .form-model-card,
    .grupo-card,
    .unidade-card,
    .governo-card,
    .secretaria-card,
    .departamento-card,
    .assunto-card,
    .area-card,
    .secretaria-view-card
) {
    background: #ffffff;
    border: 1px solid #e8e6ed;
    border-radius: 0.5rem;
    box-shadow:
        0 1px 2px rgba(34, 41, 47, 0.05),
        0 4px 12px rgba(34, 41, 47, 0.07),
        0 12px 28px rgba(34, 41, 47, 0.08);
    transition: box-shadow 0.2s ease;
}

:is(
    .usuario-list-card,
    .usuario-card,
    .governo-list-card,
    .secretaria-list-card,
    .controle-acesso-list-card,
    .departamento-list-card,
    .categoria-list-card,
    .area-list-card,
    .unidade-list-card,
    .assunto-list-card,
    .categoria-card,
    .vinculo-unidade-card,
    .classificacao-card,
    .mapa-regional-card,
    .controle-acesso-card,
    .form-model-card,
    .grupo-card,
    .unidade-card,
    .governo-card,
    .secretaria-card,
    .departamento-card,
    .assunto-card,
    .area-card,
    .secretaria-view-card
) {
    overflow: hidden;
}

:is(
    .usuario-list-card,
    .usuario-card,
    .governo-list-card,
    .secretaria-list-card,
    .controle-acesso-list-card,
    .departamento-list-card,
    .categoria-list-card,
    .area-list-card,
    .unidade-list-card,
    .assunto-list-card,
    .categoria-card,
    .vinculo-unidade-card,
    .classificacao-card,
    .controle-acesso-menu-section,
    .mapa-regional-card,
    .controle-acesso-card,
    .form-model-card,
    .grupo-card,
    .unidade-card,
    .governo-card,
    .secretaria-card,
    .departamento-card,
    .assunto-card,
    .area-card,
    .secretaria-view-card
):hover {
    box-shadow:
        0 2px 4px rgba(34, 41, 47, 0.06),
        0 8px 20px rgba(34, 41, 47, 0.09),
        0 18px 40px rgba(34, 41, 47, 0.1);
}

@media (hover: none) {
    :is(
        .usuario-list-card,
        .usuario-card,
        .governo-list-card,
        .secretaria-list-card,
        .controle-acesso-list-card,
        .departamento-list-card,
        .categoria-list-card,
        .area-list-card,
        .unidade-list-card,
        .assunto-list-card,
        .categoria-card,
        .vinculo-unidade-card,
        .classificacao-card,
        .controle-acesso-menu-section,
        .mapa-regional-card,
        .controle-acesso-card,
        .form-model-card,
        .grupo-card,
        .unidade-card,
        .governo-card,
        .secretaria-card,
        .departamento-card,
        .assunto-card,
        .area-card,
        .secretaria-view-card
    ):hover {
        box-shadow:
            0 1px 2px rgba(34, 41, 47, 0.05),
            0 4px 12px rgba(34, 41, 47, 0.07),
            0 12px 28px rgba(34, 41, 47, 0.08);
    }
}

.usuario-list-card__title {
    padding: 0.95rem 1.5rem;
    border-bottom: 1px solid #ebe9f1;
    color: #5e5873;
    font-size: 1rem;
    font-weight: 700;
}

.usuario-list-card__body {
    padding: 1.5rem;
}

.usuario-list-form {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) auto;
    gap: 1rem;
    align-items: end;
}

.usuario-list-form--registros {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-end;
    gap: 1rem;
}

.usuario-list-form--registros > div {
    min-width: 0;
}

.usuario-list-form--registros > div:nth-child(1) {
    flex: 0 0 6.75rem;
}

.usuario-list-form--registros > div:nth-child(2),
.usuario-list-form--registros > div:nth-child(3) {
    flex: 1 1 11rem;
}

.usuario-list-form--registros > div:nth-child(4) {
    flex: 0 0 11.5rem;
}

.usuario-list-form__actions {
    display: flex;
    align-items: end;
}

.usuario-list-form--registros .usuario-list-form__actions {
    flex: 0 0 auto;
    gap: 0.5rem;
    flex-wrap: nowrap;
    justify-content: flex-end;
}

.usuario-list-card__body:has(.usuario-list-form--registros) {
    overflow-x: auto;
}

.usuario-list-label {
    display: block;
    margin-bottom: 0.55rem;
    color: #5e5873;
    font-weight: 600;
}

.usuario-list-select,
.usuario-list-form .form-control,
.usuario-list-form .form-select {
    min-height: 48px;
    border-radius: 0.45rem;
    border-color: #d8d6de;
    color: #6e6b7b;
}

.usuario-list-select:focus,
.usuario-list-form .form-control:focus,
.usuario-list-form .form-select:focus {
    border-color: #7367f0;
    box-shadow: 0 0 0 0.15rem rgba(115, 103, 240, 0.15);
}

.usuario-list-select:disabled {
    background: #f8f8f8;
    color: #a8a6b3;
}

.usuario-list-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.usuario-list-toolbar__left {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.usuario-list-toolbar__count {
    color: #6e6b7b;
    font-weight: 600;
}

.usuario-list-toolbar__page-size {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
}

.usuario-list-toolbar__search {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: min(100%, 360px);
}

.usuario-list-label--inline {
    margin-bottom: 0;
    white-space: nowrap;
}

.usuario-list-select--small {
    min-width: 88px;
}

.usuario-list-table-wrap {
    overflow-x: auto;
}

.usuario-list-table {
    margin-bottom: 0;
    min-width: 720px;
}

.usuario-list-table thead th {
    border-bottom: 1px solid #ebe9f1;
    color: #6e6b7b;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
    padding: 0.9rem 1rem;
}

.usuario-list-table tbody td {
    vertical-align: middle;
    color: #5e5873;
    padding: 1rem;
    border-bottom: 1px solid #f1f1f4;
}

.usuario-list-empty {
    min-height: 120px;
    border: 1px dashed #d8d6de;
    border-radius: 0.75rem;
    background: #fcfcfd;
    color: #6e6b7b;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    text-align: center;
    padding: 1.5rem;
}

.usuario-list-btn {
    min-height: 2.7rem;
    border-radius: 0.45rem;
    padding: 0.65rem 1rem;
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    font-weight: 600;
    border: 1px solid transparent;
}

.usuario-list-btn--outline {
    background: #ffffff;
    color: #7367f0;
    border-color: #7367f0;
}

.usuario-list-btn__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.usuario-list-btn--primary {
    background: linear-gradient(118deg, #7367f0, rgba(115, 103, 240, 0.7));
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(115, 103, 240, 0.24);
}

.usuario-list-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.usuario-list-pagination__summary,
.usuario-list-pagination__current {
    color: #6e6b7b;
    font-weight: 600;
}

.usuario-list-pagination__actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

@media (max-width: 767.98px) {
    .usuario-list-page__header {
        flex-direction: column;
        align-items: stretch;
    }

    .usuario-list-form:not(.usuario-list-form--registros) {
        grid-template-columns: 1fr;
    }

    .usuario-list-form--registros {
        flex-wrap: wrap;
    }

    .usuario-list-form--registros > div {
        flex: 1 1 100%;
    }

    .usuario-list-form--registros .usuario-list-form__actions {
        flex: 1 1 100%;
        justify-content: stretch;
    }

    .usuario-list-toolbar,
    .usuario-list-toolbar__left,
    .usuario-list-toolbar__search,
    .usuario-list-pagination,
    .usuario-list-pagination__actions {
        flex-direction: column;
        align-items: stretch;
    }

    .usuario-list-btn {
        width: 100%;
        justify-content: center;
    }

    .usuario-list-card__body {
        padding: 1rem;
    }

    .usuario-list-page__title {
        font-size: 1.55rem;
    }
}

/*
 * Ícone ao lado do título: tamanho e forma únicos em todo o sistema (referência: Solicitações / usuario-list).
 * !important garante o padrão mesmo com CSS com escopo do Blazor em páginas de lista/cadastro/visualização.
 */
.usuario-list-page__title-icon,
.area-list-page__title-icon,
.area-page__title-icon,
.assunto-list-page__title-icon,
.assunto-page__title-icon,
.subdivisao-list-page__title-icon,
.subdivisao-page__title-icon,
.governo-list-page__title-icon,
.governo-page__title-icon,
.classificacao-page__title-icon,
.grupo-page__title-icon,
.secretaria-list-page__title-icon,
.secretaria-page__title-icon,
.secretaria-view-page__title-icon,
.departamento-list-page__title-icon,
.departamento-page__title-icon,
.departamento-view-page__title-icon,
.unidade-list-page__title-icon,
.unidade-page__title-icon,
.unidade-view-page__title-icon,
.controle-acesso-list-page__title-icon,
.controle-acesso-page__title-icon,
.controle-acesso-menu-page__title-icon,
.categoria-list-page__title-icon,
.categoria-page__title-icon,
.mapa-regional-page__title-icon,
.form-model-page__title-icon,
.usuario-view-page__title-icon,
.servico-view-page__title-icon,
.vinculo-unidade-page__title-icon,
.usuario-page__title-icon {
    width: 4rem !important;
    height: 4rem !important;
    border-radius: 0.85rem !important;
    flex-shrink: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #f3f2f7 !important;
    color: #7367f0 !important;
}

.usuario-list-page__title-icon svg,
.area-list-page__title-icon svg,
.area-page__title-icon svg,
.assunto-list-page__title-icon svg,
.assunto-page__title-icon svg,
.subdivisao-list-page__title-icon svg,
.subdivisao-page__title-icon svg,
.governo-list-page__title-icon svg,
.governo-page__title-icon svg,
.classificacao-page__title-icon svg,
.grupo-page__title-icon svg,
.secretaria-list-page__title-icon svg,
.secretaria-page__title-icon svg,
.secretaria-view-page__title-icon svg,
.departamento-list-page__title-icon svg,
.departamento-page__title-icon svg,
.departamento-view-page__title-icon svg,
.unidade-list-page__title-icon svg,
.unidade-page__title-icon svg,
.unidade-view-page__title-icon svg,
.controle-acesso-list-page__title-icon svg,
.controle-acesso-page__title-icon svg,
.controle-acesso-menu-page__title-icon svg,
.categoria-list-page__title-icon svg,
.categoria-page__title-icon svg,
.mapa-regional-page__title-icon svg,
.form-model-page__title-icon svg,
.usuario-view-page__title-icon svg,
.servico-view-page__title-icon svg,
.vinculo-unidade-page__title-icon svg,
.usuario-page__title-icon svg {
    width: 2rem !important;
    height: 2rem !important;
}

/* Botão padrão Limpar filtros (ícone + rótulo) — referência: /Atendimento */
.siam-clear-filters-btn {
    min-height: 48px;
    min-width: 180px;
    border-radius: 12px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
}

.siam-clear-filters-btn__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.siam-clear-filters-btn__icon svg,
.siam-clear-filters-btn__icon .siam-icon {
    width: 1rem;
    height: 1rem;
}

@media (max-width: 767.98px) {
    .atendimento-hub-filter-grid__actions .siam-clear-filters-btn,
    .carta-servicos-filters__actions .siam-clear-filters-btn {
        min-width: 0;
        width: 100%;
    }
}

.atendimento-modal__action-btn--split.siam-clear-filters-btn,
.cep-street-search-modal__toolbar-btn.siam-clear-filters-btn {
    min-width: 0;
}

@media (max-width: 767.98px) {
    .usuario-list-page__title {
        font-size: 1.45rem;
    }

    .usuario-list-page__title-icon {
        width: 3.25rem;
        height: 3.25rem;
    }
}