/*
 * Ajustes visuais — lote 1 (auditoria 3A, 10/10/2026). Mantém o design atual; só corrige defeitos repetidos.
 * Carregado por último em todas as telas do admin (layout_v2, componente do menu lateral e Alterar senha).
 * Uma seção por item (a–f), para poder desfazer um item sem mexer nos outros.
 */

/* (a) "Filtros avançados" com recuo interno, dentro do quadro (antes colado na borda, 1 px para dentro). */
.admin-advanced-filter-shell,
.agenda-v2-filter-shell {
    margin: 14px 16px 0 !important;
    width: auto !important;          /* o contêiner tinha largura de 100%: com a margem, o painel aberto saía à direita */
    max-width: calc(100% - 32px);
    box-sizing: border-box;
}
.v2-panel > .v2-filter-toggle {
    margin: 14px 0 0 16px !important;
}
@media (max-width: 760px) {
    .admin-advanced-filter-shell,
    .agenda-v2-filter-shell {
        margin: 12px 12px 0 !important;
        max-width: calc(100% - 24px);
    }
    .v2-panel > .v2-filter-toggle {
        margin: 12px 0 0 12px !important;
    }
}

/* (b) Título de página com tamanho único (o mais comum hoje: 32 px no desktop, 22 px no celular) e subtítulo 16 px.
 *     Só o tamanho: peso, cor e fonte de cada tela continuam como estão. O ícone do título acompanha o texto. */
.v2-main h1,
.password-gate__main h1,
body.has-cadastros-shell:not(.admin-v2) .wrap h1 {
    font-size: 32px !important;
    line-height: 1.15 !important;
}
.v2-main h1 > i[class*="bi-"],
.password-gate__main h1 > i[class*="bi-"] {
    font-size: 1em !important;
}
.v2-main h1 + p,
.password-gate__main h1 + p,
body.has-cadastros-shell:not(.admin-v2) .wrap h1 + p {
    font-size: 16px !important;
}
@media (max-width: 760px) {
    .v2-main h1,
    .password-gate__main h1,
    body.has-cadastros-shell:not(.admin-v2) .wrap h1 {
        font-size: 22px !important;
    }
}

/* (c) Barras de filtro: campos e botões com a mesma altura (40 px, a mais comum hoje) e alinhados pela base;
 *     no celular, botões empilhados com largura total. Só barras de filtro/busca (GET); formulários de salvar não mudam. */
:is(.admin-advanced-filter-panel form, form.v2-filters, form.agenda-filters, #agendaFiltersForm, #freeBlocksFilterForm,
    #occupancyFilterForm, form.filters, form.toolbar, form.rem-filters, form.search-row,
    .v2-panel > form.form-grid:not([method="post" i]))
    :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, .btn, .v2-btn, button:not(.live-search-clear)):not(:is(.patient-search-select, .searchable-select) button) {
    height: 40px !important;
    min-height: 40px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    box-sizing: border-box !important;
}
:is(.admin-advanced-filter-panel form, form.v2-filters, form.agenda-filters, #agendaFiltersForm, #freeBlocksFilterForm,
    #occupancyFilterForm, form.filters, form.toolbar, form.rem-filters, form.search-row,
    .v2-panel > form.form-grid:not([method="post" i]))
    :is(.btn, .v2-btn, button:not(.live-search-clear)):not(:is(.patient-search-select, .searchable-select) button) {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    line-height: 1.2 !important;
    align-self: end;
}
@media (max-width: 760px) {
    :is(.admin-advanced-filter-panel form, form.v2-filters, form.agenda-filters, #agendaFiltersForm, #freeBlocksFilterForm,
        #occupancyFilterForm, form.filters, form.toolbar, form.rem-filters, form.search-row,
        .v2-panel > form.form-grid:not([method="post" i]))
        :is(.btn, .v2-btn, button:not(.live-search-clear)):not(:is(.patient-search-select, .searchable-select) button) {
        width: 100% !important;
        flex: 1 1 100% !important;
    }
    :is(.admin-advanced-filter-panel form, form.v2-filters, form.agenda-filters, #agendaFiltersForm, #freeBlocksFilterForm,
        #occupancyFilterForm, form.filters, form.toolbar, form.rem-filters, form.search-row,
        .v2-panel > form.form-grid:not([method="post" i])) :has(> :is(.btn, .v2-btn, button)),
    :is(.admin-advanced-filter-panel form, form.v2-filters, form.agenda-filters, #agendaFiltersForm, #freeBlocksFilterForm,
        #occupancyFilterForm, form.filters, form.toolbar, form.rem-filters, form.search-row,
        .v2-panel > form.form-grid:not([method="post" i])):has(> :is(.btn, .v2-btn, button)) {
        flex-wrap: wrap !important;
    }
    /* barras em grade: uma coluna só no celular (campos e botões empilhados) */
    :is(.admin-advanced-filter-panel form, form.v2-filters, form.agenda-filters, #agendaFiltersForm, #freeBlocksFilterForm,
        #occupancyFilterForm, form.filters, form.toolbar, form.rem-filters, form.search-row,
        .v2-panel > form.form-grid:not([method="post" i])) {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

/* (d) Cores do sistema no lugar do azul padrão do Bootstrap nas telas que não usavam a paleta (Usuários, Mensagens,
 *     Alterar senha e as demais com o mesmo defeito: Agenda, Estoque, Vendas, Configurações). Mesmos valores que as
 *     telas de Cadastros já usam (renovare-palette.css / admin-premium.css). Só cor: tamanho e forma não mudam. */
body.admin-v2:not(.has-cadastros-shell) .btn-primary {
    background: linear-gradient(135deg, #306F7C 0%, #255A66 100%) !important;
    border-color: transparent !important;
    color: #fff !important;
}
body.admin-v2:not(.has-cadastros-shell) .btn-primary:hover,
body.admin-v2:not(.has-cadastros-shell) .btn-primary:focus-visible {
    background: linear-gradient(135deg, #255A66 0%, #1E4A54 100%) !important;
}
body.admin-v2:not(.has-cadastros-shell) .btn-outline-primary {
    color: #255A66 !important;
    border-color: #B7CDD4 !important;
    background: #F9FCFD !important;
}
body.admin-v2:not(.has-cadastros-shell) .btn-outline-primary:hover,
body.admin-v2:not(.has-cadastros-shell) .btn-outline-primary.active,
body.admin-v2:not(.has-cadastros-shell) .btn-check:checked + .btn-outline-primary,
body.admin-v2:not(.has-cadastros-shell) .admin-advanced-filter-toggle[aria-expanded="true"] {
    color: #fff !important;
    border-color: #306F7C !important;
    background: #306F7C !important;
}
body.admin-v2:not(.has-cadastros-shell) .form-check-input:checked {
    background-color: #306F7C !important;
    border-color: #306F7C !important;
}
body.admin-v2:not(.has-cadastros-shell) :is(.form-control, .form-select, .v2-input, .v2-select, input, select, textarea):focus {
    border-color: #306F7C !important;
    box-shadow: 0 0 0 .22rem rgba(48, 111, 124, .14) !important;
}
body.admin-v2:not(.has-cadastros-shell) :is(.settings-tabs, .msg-tabs) a.active {
    color: #255A66 !important;
    background: #EAF3F5 !important;
}
body.admin-v2:not(.has-cadastros-shell) .msg-v2 summary {
    color: #255A66 !important;
}

/* (e) Área de toque de no mínimo 44 px no celular (admin, logins, portal e site público).
 *     Caixas de seleção e a barra do editor de texto (TinyMCE, componente externo) ficam como estão. */
@media (max-width: 760px) {
    /* admin: botões, campos, abas, cabeçalho e menu */
    :is(body.admin-v2, body.has-cadastros-shell) :is(.btn, .v2-btn, .v2-header-link, .v2-dashboard-btn, .v2-filter-toggle,
        .site-settings-tab, .settings-tabs a, .msg-tabs a, .password-gate__logout,
        button:not(.live-search-clear):not([class*="tox-"]):not(:is(.patient-search-select, .searchable-select) button),
        input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]), select, .form-control, .form-select) {
        min-height: 44px !important;
    }
    :is(body.admin-v2, body.has-cadastros-shell) :is(.btn, .v2-btn, .v2-header-link, .v2-dashboard-btn, .password-gate__logout,
        .settings-tabs a, .msg-tabs a) {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
    }
    /* com inline-flex o espaço entre ícone e texto some: devolve um espaço equivalente
       (especificidade zero, não altera botões que já definem o próprio espaçamento) */
    :where(body.admin-v2, body.has-cadastros-shell) :where(.btn, .v2-btn, .v2-header-link, .v2-dashboard-btn, .password-gate__logout, .settings-tabs a, .msg-tabs a) {
        column-gap: .3em;
    }
    :is(body.admin-v2, body.has-cadastros-shell) :is(.v2-icon-button, .cad-shell-toggle, .cad-shell-mobile-toggle, .site-help-trigger) {
        min-width: 44px !important;
        min-height: 44px !important;
    }
    :is(body.admin-v2, body.has-cadastros-shell) :is(.v2-header-link, .password-gate__logout, .cad-shell-topbar-actions a,
        .list-footer__pagination a, .admin-pagination-uniform a, .pagination a, .page-link) {
        min-width: 44px !important;
        min-height: 44px !important;
    }
    :is(body.admin-v2, body.has-cadastros-shell) :is(.list-footer__pagination a, .admin-pagination-uniform a) {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
    }
    :is(body.admin-v2, body.has-cadastros-shell) .v2-brand {
        min-height: 44px !important;
        display: inline-flex !important;
        align-items: center;
    }
    /* nomes clicáveis nas listas, "Detalhes" e "Ver mensagem" */
    :is(body.admin-v2, body.has-cadastros-shell) :is(.record-main-link, .v2-record-link, .msg-v2 td a, .msg-v2 summary) {
        display: inline-flex !important;
        align-items: center;
        min-height: 44px !important;
    }
    /* barras de filtro (item c): 40 px no desktop, 44 px no celular */
    :is(.admin-advanced-filter-panel form, form.v2-filters, form.agenda-filters, #agendaFiltersForm, #freeBlocksFilterForm,
        #occupancyFilterForm, form.filters, form.toolbar, form.rem-filters, form.search-row,
        .v2-panel > form.form-grid:not([method="post" i]))
        :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, .btn, .v2-btn, button:not(.live-search-clear)):not(:is(.patient-search-select, .searchable-select) button) {
        height: 44px !important;
        min-height: 44px !important;
    }
    /* logins, recuperação de senha, portal e site público */
    .password-toggle {
        min-width: 44px !important;
        min-height: 44px !important;
    }
    :is(a.forgot-link, .back a, .student-access-link a, .admin-shortcut a, .public-footer-links a,
        .public-footer a:not(.public-copyright a), .portal-mobile-brand) {
        display: inline-flex !important;
        align-items: center;
        min-height: 44px !important;
    }
    a.forgot-link {
        justify-content: center;
    }
    :where(a.forgot-link, .back a, .student-access-link a, .admin-shortcut a, .public-footer-links a,
        .public-footer a, .portal-mobile-brand) {
        column-gap: .3em;
    }
    /* links de crédito dentro de frase (rodapés): área de toque ampliada sem mudar o texto nem a linha */
    :is(.v2-footer, .renovare-admin-footer, .login-footer, .footer, .student-login-footer, .public-copyright) a {
        display: inline !important;
        padding-top: 14px;
        padding-bottom: 14px;
    }
}

/* (f) Menu recolhido: só um item destacado por vez. O destaque fica com o grupo da página atual;
 *     um grupo que estava expandido no menu aberto (ex.: Cadastros) não acende junto. */
@media (min-width: 761px) {
    :is(html.admin-v2-pre-collapsed, .v2-shell-compact) .v2-nav-group:not(.is-active) .v2-group-toggle[aria-expanded="true"] {
        background: transparent;
        color: var(--admin-sidebar-muted);
    }
}

/* (g) Campo com símbolo DENTRO (13/10/2026): "R$" antes ou "%" depois do número, com a mesma borda, altura,
 *     raio e foco do campo (o símbolo é desenhado sobre o próprio input; não há caixa à parte).
 *     Uso: <div class="rp-affix" data-prefix="R$"><input class="form-control" ...></div>
 *          <div class="rp-affix" data-suffix="%"><input class="form-control" ...></div>
 *     Um script pode trocar o símbolo mudando data-prefix/data-suffix (ex.: desconto em R$ ou %). */
.rp-affix {
    position: relative;
    display: block;
    min-width: 0;
}
.rp-affix > .form-control {
    width: 100%;
}
.rp-affix[data-prefix] > .form-control {
    padding-left: calc(.75rem + 1.9em);
}
.rp-affix[data-suffix] > .form-control {
    padding-right: calc(.75rem + 1.5em);
}
.rp-affix[data-prefix]::before,
.rp-affix[data-suffix]::after {
    position: absolute;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    color: #5b6b7c;
    font-weight: 600;
    pointer-events: none;
    z-index: 3;
}
.rp-affix[data-prefix]::before {
    content: attr(data-prefix);
    left: .8rem;
}
.rp-affix[data-suffix]::after {
    content: attr(data-suffix);
    right: .8rem;
}
.rp-affix:has(> .form-control:disabled)::before,
.rp-affix:has(> .form-control:disabled)::after {
    opacity: .55;
}
/* Dentro de uma linha .input-group (ex.: tipo + valor + botão), o campo ocupa o espaço livre. */
.input-group > .rp-affix {
    flex: 1 1 auto;
    width: 1%;
}
.input-group > .rp-affix > .form-control {
    border-radius: 0;
}

/* (h) Rodapé da lista dentro do cartão (13/10/2026, PADRAO-VISUAL.md): o layout move "Mostrando X–Y de Z" + páginas
 *     para o fim do cartão da tabela (.lp-card-foot). Estilo também fora do .lp (ex.: Pacientes). */
.lp-card-foot { padding: 12px 16px 14px; border-top: 1px solid #E3EAF1; }
.lp-card-foot .admin-v2-list-pagination { display: flex !important; align-items: center !important; justify-content: space-between !important; flex-wrap: wrap !important; gap: 10px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
.lp-card-foot .list-footer__summary { color: #526777; font-size: 14px; }
@media (max-width: 760px) { .lp-card-foot { padding: 12px; } }

/* (i) Botão principal único (13/10/2026, PADRAO-VISUAL.md): azul-petróleo em todo o sistema.
 *     Antes alguns "Salvar" (.btn-save), o "Novo Paciente" (.btn-new) e os .btn-success eram verdes.
 *     Na faixa escura do cabeçalho, o principal é claro com texto petróleo (como no padrão .lp-header). */
.btn.btn-save, .btn.btn-success {
    background: #306F7C !important; background-image: none !important; border-color: #306F7C !important;
    color: #fff !important; box-shadow: 0 6px 14px rgba(48, 111, 124, .22) !important;
}
.btn.btn-save:hover, .btn.btn-save:focus-visible, .btn.btn-success:hover, .btn.btn-success:focus-visible {
    background: #255A66 !important; border-color: #255A66 !important; color: #fff !important;
}
.btn.btn-new {
    background: #fff !important; background-image: none !important; border: 1px solid #fff !important;
    color: #1B4057 !important; box-shadow: 0 8px 18px rgba(10, 30, 45, .18) !important;
}
.btn.btn-new:hover, .btn.btn-new:focus-visible { background: #EAF3F5 !important; color: #1B4057 !important; }

/* (j) Telas do shell de Cadastros (ex.: Modalidades adicionar/editar/salas): a largura era calc(100vw - menu); 100vw
 *     inclui a barra de rolagem vertical e, em página longa, sobrava 15 px de rolagem lateral. 100% = largura do body. */
@media (min-width: 992px) {
    body.has-cadastros-shell .cad-shell-topbar,
    body.has-cadastros-shell .wrap,
    body.has-cadastros-shell .renovare-admin-footer,
    body.has-cadastros-shell .support-access-banner { width: calc(100% - var(--cad-shell-current-width)) !important; }
    body.has-cadastros-shell.cad-shell-collapsed .cad-shell-topbar,
    body.has-cadastros-shell.cad-shell-collapsed .wrap,
    body.has-cadastros-shell.cad-shell-collapsed .renovare-admin-footer,
    body.has-cadastros-shell.cad-shell-collapsed .support-access-banner { width: calc(100% - var(--cad-shell-collapsed-width)) !important; }
}

/* (k) Layout base único (14/10/2026, PADRAO-VISUAL.md).
 *  k1. O admin-premium.css (shell antigo) dá às caixas .patient-tab-wrap (abas da ficha do paciente), .clinical-wrap
 *      (aba Avaliações) e .agenda-state-wrap um recuo igual à largura do menu e largura calc(100vw - menu). Dentro do
 *      layout novo o conteúdo já fica ao lado do menu: o recuo contava duas vezes e o .v2-main cortava a direita.
 *  k2. (removido em 14/10/2026) Não há largura máxima centralizada: o conteúdo ocupa toda a largura ao lado do menu,
 *      com o mesmo recuo interno (--admin-content-padding) dos dois lados, em qualquer largura.
 *  k3. Cartões de números (lp_kpis): grade por quantidade de cartões e pela largura que sobra ao lado do menu
 *      (container query) — 6 → 6 | 3+3 | 2+2+2 | 1 por linha; nunca 1 cartão sozinho numa linha.
 *  k4. Tabelas: valores e datas sem quebra (classe lp-nowrap, aplicada também pelo layout-responsivo.js); nome em até
 *      2 linhas com "…" (lp-clamp-2 + title); tabela que não cabe rola DENTRO do cartão (lp-table-rola), nunca cortada. */
body.admin-v2.admin-v2 .v2-main .patient-tab-wrap,
body.admin-v2.admin-v2 .v2-main .clinical-wrap,
body.admin-v2.admin-v2 .v2-main .agenda-state-wrap {
    margin-left: auto !important; margin-right: auto !important;
    width: auto !important; max-width: 100% !important; min-width: 0 !important;
    padding-left: 0 !important; padding-right: 0 !important;
}
.lp .lp-kpis-box { container-type: inline-size; margin-top: 16px; }
.lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis { margin-top: 0 !important; grid-template-columns: minmax(0, 1fr) !important; }
@container (min-width: 420px) {
    .lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis-n2,
    .lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis-n4,
    .lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis-n6,
    .lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis-n8 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@container (min-width: 600px) {
    .lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis-n3,
    .lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis-n5,
    .lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis-n6,
    .lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis-n7,
    .lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis-n9 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@container (min-width: 860px) {
    .lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis-n4,
    .lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis-n8 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}
@container (min-width: 1000px) {
    .lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis-n5 { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
}
@container (min-width: 1060px) {
    .lp:not(#lp_):not(#lp__) .lp-kpis-box > .lp-kpis.lp-kpis-n6 { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
}
.lp:not(#lp_):not(#lp__) .lp-kpis-box .lp-kpi { min-width: 0 !important; }
.lp:not(#lp_):not(#lp__) .lp-kpis-box .lp-kpi strong { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.lp:not(#lp_):not(#lp__) .lp-kpis-box .lp-kpi small { display: block !important; margin-top: 4px !important; color: #64748B !important; font-size: 12.5px !important; font-weight: 600 !important; line-height: 1.35 !important; }
.v2-main td.lp-nowrap, .v2-main th.lp-nowrap, .v2-main .lp-nowrap { white-space: nowrap !important; }
.lp-clamp-2 { display: -webkit-box !important; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; min-width: 13ch; }
.lp:not(#lp_):not(#lp__) .lp-table-wrap.lp-table-rola, .v2-main .lp-table-rola { overflow-x: auto !important; overflow-y: hidden !important; max-width: 100% !important; -webkit-overflow-scrolling: touch; }
/*  k5. Cabeçalhos antigos (.top) com botões à direita quebram linha em vez de passar da tela (ex.: Editar matrícula no
 *      celular); links do cabeçalho e do rodapé sem sublinhado em todas as telas (na Agenda apareciam sublinhados);
 *      cartões do Financeiro no celular: texto longo quebra dentro do cartão; grade de 4 opções em 2+2 (ou 4 numa linha
 *      em tela larga), nunca 3+1. */
body.admin-v2 .v2-main .top > .d-flex { flex-wrap: wrap; }
body.admin-v2 .v2-header a.v2-header-link, body.admin-v2 .v2-header a.v2-header-link:hover, body.admin-v2 .v2-footer a, body.admin-v2 .v2-footer a:hover { text-decoration: none !important; }
body.admin-v2-financeiro .finance-mobile-card dl div { min-width: 0; gap: 10px; }
body.admin-v2-financeiro .finance-mobile-card dl dt { flex: 0 0 auto; }
body.admin-v2.admin-v2-financeiro .finance-mobile-card dd { white-space: normal !important; overflow-wrap: anywhere; min-width: 0; text-align: right; }
@media (min-width: 761px) {
    .v2-main .finance-method-grid:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (min-width: 1500px) {
    .v2-main .finance-method-grid:has(> :nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}
/*  k6. Rodapé de formulário antigo (.foot): quebra linha; no celular, botões em largura total (ex.: Editar matrícula,
 *      onde "Voltar" saía pela esquerda em 360/390 px). */
body.admin-v2 .v2-main .foot { flex-wrap: wrap; }
@media (max-width: 767.98px) {
    body.admin-v2 .v2-main .foot > .btn, body.admin-v2 .v2-main .foot > a.btn { flex: 1 1 100%; justify-content: center; }
}
/*  k7. Grades de 2 colunas com quantidade ímpar de cartões (ex.: Pendências clínicas na aba Avaliações do paciente):
 *      o último ocupa a linha inteira, em vez de ficar sozinho pela metade. */
.v2-main .pending-grid > :last-child:nth-child(odd):not(:first-child) { grid-column: 1 / -1; }