/**
 * Componentes base — botões, formulários, tabelas, cards, modais, alertas, paginação.
 * Depende de design-tokens.css. Carregar após app.css para sobrescrever legado pontual.
 */

/* ------------------------------------------------------------------------- */
/* Botões                                                                    */
/* ------------------------------------------------------------------------- */

.btn {
    --btn-bg: var(--ds-surface-card);
    --btn-fg: var(--ds-text-primary);
    --btn-border: var(--ds-border-default);
    --btn-shadow: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--ds-space-1);
    min-height: var(--ds-btn-height);
    padding: 0 var(--ds-space-2);
    border-radius: var(--ds-radius-sm);
    border: 1px solid var(--btn-border);
    background: var(--btn-bg);
    color: var(--btn-fg);
    box-shadow: var(--btn-shadow);
    text-decoration: none;
    font-family: inherit;
    font-size: var(--ds-font-size-body);
    font-weight: var(--ds-font-weight-medium);
    line-height: 1.25;
    cursor: pointer;
    transition:
        var(--ds-transition-color),
        box-shadow var(--ds-duration) var(--ds-ease-out),
        opacity var(--ds-duration-fast) var(--ds-ease-out);
}

.btn:hover:not(:disabled):not([aria-disabled="true"]) {
    --btn-bg: var(--ds-surface-hover);
    --btn-border: var(--ds-border-strong);
}

.btn:active:not(:disabled):not([aria-disabled="true"]) {
    opacity: 0.94;
}

.btn:focus-visible {
    outline: none;
    box-shadow: var(--ds-shadow-ring-focus), var(--btn-shadow, none);
}

.btn:disabled,
.btn[aria-disabled="true"] {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

/* Primary */
.btn.primary {
    --btn-bg: var(--ds-color-primary);
    --btn-fg: var(--ds-color-primary-foreground);
    --btn-border: var(--ds-color-primary);
    --btn-shadow: var(--ds-shadow-xs);
}

.btn.primary:hover:not(:disabled):not([aria-disabled="true"]) {
    --btn-bg: var(--ds-color-primary-hover);
    --btn-border: var(--ds-color-primary-hover);
}

.btn.primary:active:not(:disabled):not([aria-disabled="true"]) {
    --btn-bg: var(--ds-color-primary-active);
    --btn-border: var(--ds-color-primary-active);
}

/* Secondary explícito (= estilo outline premium; mesmo visual do .btn padrão refinado) */
.btn.secondary {
    --btn-bg: var(--ds-surface-card);
    --btn-fg: var(--ds-text-primary);
    --btn-border: var(--ds-border-default);
}

.btn.secondary:hover:not(:disabled):not([aria-disabled="true"]) {
    --btn-bg: var(--ds-surface-muted);
    --btn-border: var(--ds-border-strong);
}

/* Ghost */
.btn.ghost {
    --btn-bg: transparent;
    --btn-border: transparent;
    --btn-fg: var(--ds-text-secondary);
}

.btn.ghost:hover:not(:disabled):not([aria-disabled="true"]) {
    --btn-bg: var(--ds-surface-hover);
    --btn-fg: var(--ds-text-primary);
    --btn-border: transparent;
}

.btn.ghost:focus-visible {
    --btn-border: var(--ds-border-default);
}

/* Danger */
.btn.danger {
    --btn-bg: var(--ds-color-error-muted);
    --btn-fg: var(--ds-color-error);
    --btn-border: var(--ds-color-error-border);
}

.btn.danger:hover:not(:disabled):not([aria-disabled="true"]) {
    --btn-bg: rgba(220, 38, 38, 0.16);
    --btn-border: var(--ds-color-error);
}

.btn.danger:focus-visible {
    box-shadow: 0 0 0 2px var(--ds-surface-card), 0 0 0 4px rgba(220, 38, 38, 0.28);
}

/* Tamanho compacto */
.btn.small {
    min-height: var(--ds-btn-height-sm);
    padding: 0 var(--ds-space-2);
    font-size: var(--ds-font-size-small);
    border-radius: var(--ds-radius-sm);
    gap: 0.35rem;
}

/* ------------------------------------------------------------------------- */
/* Campos: texto, textarea, select (escopo app — não afeta login)              */
/* ------------------------------------------------------------------------- */

.main input[type="color"],
.main input[type="date"],
.main input[type="datetime-local"],
.main input[type="email"],
.main input[type="month"],
.main input[type="number"],
.main input[type="password"],
.main input[type="search"],
.main input[type="tel"],
.main input[type="text"],
.main input[type="time"],
.main input[type="url"],
.main input[type="week"],
.main textarea,
.main select,
.app-modal__body input[type="color"],
.app-modal__body input[type="date"],
.app-modal__body input[type="datetime-local"],
.app-modal__body input[type="email"],
.app-modal__body input[type="month"],
.app-modal__body input[type="number"],
.app-modal__body input[type="password"],
.app-modal__body input[type="search"],
.app-modal__body input[type="tel"],
.app-modal__body input[type="text"],
.app-modal__body input[type="time"],
.app-modal__body input[type="url"],
.app-modal__body input[type="week"],
.app-modal__body textarea,
.app-modal__body select {
    min-height: var(--ds-input-height);
    padding: 0 var(--ds-input-padding-x);
    border-radius: var(--ds-radius-sm);
    border: 1px solid var(--ds-border-default-solid);
    background: var(--ds-surface-card);
    color: var(--ds-text-primary);
    font-family: inherit;
    font-size: var(--ds-font-size-body);
    line-height: 1.35;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    transition: var(--ds-transition-surface);
}

.main textarea,
.app-modal__body textarea {
    min-height: 6rem;
    padding: var(--ds-space-1) var(--ds-input-padding-x);
    resize: vertical;
}

.main select,
.app-modal__body select {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.65rem center;
    background-size: 1rem;
    padding-right: 2.25rem;
}

.main input::placeholder,
.main textarea::placeholder,
.app-modal__body input::placeholder,
.app-modal__body textarea::placeholder {
    color: var(--ds-text-tertiary);
}

.main input:hover:not(:disabled):not([readonly]),
.main textarea:hover:not(:disabled):not([readonly]),
.main select:hover:not(:disabled),
.app-modal__body input:hover:not(:disabled):not([readonly]),
.app-modal__body textarea:hover:not(:disabled):not([readonly]),
.app-modal__body select:hover:not(:disabled) {
    border-color: var(--ds-neutral-300);
}

.main input:focus-visible,
.main textarea:focus-visible,
.main select:focus-visible,
.app-modal__body input:focus-visible,
.app-modal__body textarea:focus-visible,
.app-modal__body select:focus-visible {
    outline: none;
    border-color: var(--ds-color-primary);
    box-shadow: var(--ds-shadow-ring-focus);
}

.main input:disabled,
.main textarea:disabled,
.main select:disabled,
.app-modal__body input:disabled,
.app-modal__body textarea:disabled,
.app-modal__body select:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    background: var(--ds-surface-muted);
}

.main input[readonly],
.app-modal__body input[readonly] {
    background: var(--ds-surface-muted);
    color: var(--ds-text-secondary);
}

/* Estados de validação (opcional em markup) */
.main input[aria-invalid="true"],
.main textarea[aria-invalid="true"],
.main select[aria-invalid="true"],
.app-modal__body input[aria-invalid="true"],
.app-modal__body textarea[aria-invalid="true"],
.app-modal__body select[aria-invalid="true"],
.input--error {
    border-color: var(--ds-color-error);
}

.main input[aria-invalid="true"]:focus-visible,
.main textarea[aria-invalid="true"]:focus-visible,
.main select[aria-invalid="true"]:focus-visible,
.input--error:focus-visible {
    box-shadow: 0 0 0 2px var(--ds-surface-card), 0 0 0 4px rgba(220, 38, 38, 0.26);
}

.input--success,
.main input.input--success,
.main select.input--success {
    border-color: var(--ds-color-success);
}

.input--success:focus-visible {
    box-shadow: 0 0 0 3px rgba(5, 150, 105, 0.22);
}

/* Busca / toolbar (cadastros) */
.parties-table-toolbar__input,
.parties-table-toolbar__select {
    width: 100%;
    min-width: 0;
    min-height: var(--ds-input-height);
    padding: 0 var(--ds-input-padding-x);
    border-radius: var(--ds-radius-sm);
    border: 1px solid var(--ds-border-default-solid);
    background: var(--ds-surface-card);
    font-family: inherit;
    font-size: var(--ds-font-size-body);
    transition: border-color 0.14s ease, box-shadow 0.14s ease;
}

.parties-table-toolbar__input:focus-visible,
.parties-table-toolbar__select:focus-visible {
    outline: none;
    border-color: var(--ds-color-primary);
    box-shadow: var(--ds-shadow-ring-focus);
}

.parties-table-toolbar__select {
    min-width: 11rem;
    max-width: 100%;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.55rem center;
    padding-right: 2rem;
    cursor: pointer;
}

/* Filtros em painel */
.filter-grid input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.filter-grid select {
    min-height: var(--ds-input-height);
    padding: 0 var(--ds-space-2);
    border-radius: var(--ds-radius-sm);
    border: 1px solid var(--ds-border-default-solid);
    background: var(--ds-surface-card);
    font-family: inherit;
    font-size: var(--ds-font-size-body);
    transition: border-color 0.14s ease, box-shadow 0.14s ease;
}

.filter-grid select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.55rem center;
    padding-right: 2rem;
    cursor: pointer;
}

.filter-grid input:focus-visible,
.filter-grid select:focus-visible {
    outline: none;
    border-color: var(--ds-color-primary);
    box-shadow: var(--ds-shadow-ring-focus);
}

.panel.filter-panel.filter-panel--invoices .filter-grid input,
.panel.filter-panel.filter-panel--invoices .filter-grid select {
    background: var(--ds-surface-card);
}

/* Controles densos (tabela recebíveis) */
.receivables-filter-control {
    min-height: var(--ds-input-height-sm);
    padding: 0.2rem 0.45rem;
    border-radius: var(--ds-radius-sm);
    border: 1px solid var(--ds-border-default-solid);
    background: var(--ds-surface-card);
    font-size: var(--ds-font-size-small);
    line-height: 1.35;
    transition: border-color 0.14s ease, box-shadow 0.14s ease;
}

.receivables-filter-control:focus-visible {
    outline: none;
    border-color: var(--ds-color-primary);
    box-shadow: var(--ds-shadow-ring-focus);
}

select.receivables-filter-control {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.35rem center;
    padding-right: 1.35rem;
}

/* Central pagamentos — select / month */
.central-pagamentos-filial-form__select,
.central-pagamentos-mes-form input[type="month"] {
    min-height: var(--ds-input-height);
    padding: 0 var(--ds-space-2);
    border-radius: var(--ds-radius-sm);
    border: 1px solid var(--ds-border-default-solid);
    background: var(--ds-surface-card);
    font-family: inherit;
    font-size: var(--ds-font-size-body);
    transition: border-color 0.14s ease, box-shadow 0.14s ease;
}

.central-pagamentos-filial-form__select:focus-visible,
.central-pagamentos-mes-form input[type="month"]:focus-visible {
    outline: none;
    border-color: var(--ds-color-primary);
    box-shadow: var(--ds-shadow-ring-focus);
}

.central-pagamentos-filial-form__select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.55rem center;
    padding-right: 2rem;
    cursor: pointer;
}

/* Campo de busca reutilizável (classe opcional) */
.input-search {
    min-height: var(--ds-input-height);
    padding-left: 2.5rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='M21 21l-4.3-4.3'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left 0.75rem center;
    background-size: 1.1rem;
}

/* ------------------------------------------------------------------------- */
/* Form grid — alinha com tokens (checkboxes permanecem toggle em app.css)   */
/* ------------------------------------------------------------------------- */

.form-grid input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.form-grid textarea,
.form-grid select {
    min-height: var(--ds-input-height);
    padding: 0 var(--ds-input-padding-x);
    border-radius: var(--ds-radius-sm);
    border: 1px solid var(--ds-border-default-solid);
    background: var(--ds-surface-card);
    font-family: inherit;
    font-size: var(--ds-font-size-body);
    transition: border-color 0.14s ease, box-shadow 0.14s ease;
}

.form-grid textarea {
    padding: var(--ds-space-1) var(--ds-input-padding-x);
    min-height: 5.5rem;
}

.form-grid select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.65rem center;
    padding-right: 2.25rem;
    cursor: pointer;
}

.form-grid input:focus-visible,
.form-grid textarea:focus-visible,
.form-grid select:focus-visible {
    outline: none;
    border-color: var(--ds-color-primary);
    box-shadow: var(--ds-shadow-ring-focus);
}

/* ------------------------------------------------------------------------- */
/* Dropdown nativo — <select> já estilizado; painéis <details> em conteúdo   */
/* ------------------------------------------------------------------------- */

.main details.content-dropdown,
.app-modal__body details.content-dropdown {
    border: 1px solid var(--ds-border-default);
    border-radius: var(--ds-radius-md);
    background: var(--ds-surface-card);
    overflow: hidden;
    box-shadow: var(--ds-shadow-xs);
}

.main details.content-dropdown > summary,
.app-modal__body details.content-dropdown > summary {
    list-style: none;
    cursor: pointer;
    padding: var(--ds-space-2) var(--ds-space-2);
    font-weight: var(--ds-font-weight-medium);
    color: var(--ds-text-primary);
    transition: background-color 0.14s ease;
}

.main details.content-dropdown > summary::-webkit-details-marker,
.app-modal__body details.content-dropdown > summary::-webkit-details-marker {
    display: none;
}

.main details.content-dropdown > summary:hover,
.app-modal__body details.content-dropdown > summary:hover {
    background: var(--ds-surface-muted);
}

.main details.content-dropdown[open] > summary,
.app-modal__body details.content-dropdown[open] > summary {
    border-bottom: 1px solid var(--ds-border-subtle);
    background: var(--ds-surface-muted);
}

.main details.content-dropdown > summary:focus-visible,
.app-modal__body details.content-dropdown > summary:focus-visible {
    outline: none;
    box-shadow: inset 0 0 0 2px var(--ds-color-primary);
}

.main details.content-dropdown .content-dropdown__body,
.app-modal__body details.content-dropdown .content-dropdown__body {
    padding: var(--ds-space-2);
    font-size: var(--ds-font-size-body);
    color: var(--ds-text-secondary);
}

/* ------------------------------------------------------------------------- */
/* Badges                                                                    */
/* ------------------------------------------------------------------------- */

.badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.28rem;
    padding: 0.2rem 0.55rem;
    min-height: 1.4rem;
    border-radius: var(--ds-radius-pill);
    font-size: 0.6875rem;
    font-weight: var(--ds-font-weight-semibold);
    line-height: 1.25;
    letter-spacing: 0.04em;
    text-transform: none;
    background: var(--ds-surface-muted);
    color: var(--ds-text-secondary);
    border: 1px solid var(--ds-border-subtle);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
    vertical-align: middle;
    transition:
        background-color 0.12s ease,
        border-color 0.12s ease,
        box-shadow 0.12s ease;
}

.badge--neutral {
    background: var(--ds-neutral-100);
    color: var(--ds-neutral-700);
    border-color: var(--ds-border-default);
}

.badge--success {
    background: var(--ds-color-success-muted);
    color: var(--ds-color-success-hover);
    border-color: var(--ds-color-success-border);
}

.badge--warning {
    background: var(--ds-color-warning-muted);
    color: var(--ds-color-warning-hover);
    border-color: var(--ds-color-warning-border);
}

.badge--danger {
    background: var(--ds-color-error-muted);
    color: var(--ds-color-error-hover);
    border-color: var(--ds-color-error-border);
}

.badge--info {
    background: var(--ds-color-info-muted);
    color: var(--ds-color-info-hover);
    border-color: var(--ds-color-info-border);
}

.badge--primary {
    background: var(--ds-color-primary-muted);
    color: var(--ds-color-primary);
    border-color: var(--ds-color-primary-border);
}

/* ------------------------------------------------------------------------- */
/* Cards e painéis                                                           */
/* ------------------------------------------------------------------------- */

.cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, clamp(11rem, 26vw, 16rem)), 1fr));
    gap: clamp(var(--ds-space-2), 2vw, var(--ds-space-3));
    margin-bottom: var(--ds-space-3);
}

.card {
    background: var(--ds-surface-card);
    border-radius: var(--ds-radius-md);
    padding: var(--ds-card-padding-compact) var(--ds-space-3);
    border: 1px solid var(--ds-border-default);
    box-shadow: var(--ds-surface-inset-top), var(--ds-shadow-xs);
    transition: var(--ds-transition-surface);
}

.card:hover {
    box-shadow: var(--ds-surface-inset-top), var(--ds-shadow-sm);
    border-color: var(--ds-border-strong);
}

.card-k {
    font-size: var(--ds-font-size-caption);
    font-weight: var(--ds-font-weight-semibold);
    color: var(--ds-text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.card-v {
    font-size: clamp(1.25rem, 2.2vw, 1.5rem);
    font-weight: var(--ds-font-weight-bold);
    margin-top: var(--ds-space-1);
    font-variant-numeric: tabular-nums;
    letter-spacing: var(--ds-letter-spacing-tight);
    color: var(--ds-text-primary);
}

.card-v.ok {
    color: var(--ds-color-success);
}

.card-v.warn {
    color: var(--ds-color-warning);
}

.panel {
    background: var(--ds-surface-card);
    border-radius: var(--ds-radius-md);
    border: 1px solid var(--ds-border-default);
    padding: var(--ds-card-padding);
    box-shadow: var(--ds-surface-inset-top), var(--ds-shadow-xs);
}

.panel h2 {
    margin: 0 0 var(--ds-space-2);
    font-size: var(--ds-font-size-h3);
    font-weight: var(--ds-font-weight-semibold);
    color: var(--ds-text-primary);
    letter-spacing: var(--ds-letter-spacing-tight);
}

.panel h3 {
    margin: var(--ds-space-2) 0 var(--ds-space-1);
    font-size: var(--ds-font-size-body-lg);
    font-weight: var(--ds-font-weight-semibold);
    color: var(--ds-text-primary);
}

.filter-panel {
    margin-bottom: var(--ds-space-3);
    border-radius: var(--ds-radius-lg);
    box-shadow: var(--ds-shadow-sm);
}

.panel.filter-panel:not(.filter-panel--invoices) {
    background: var(--ds-surface-card);
}

.panel.filter-panel.filter-panel--invoices,
.panel.invoice-zip-toolbar {
    background: var(--ds-surface-card);
    border-color: var(--ds-border-default);
    box-shadow: var(--ds-surface-inset-top), var(--ds-shadow-sm);
}

.filter-panel .filter-grid {
    gap: var(--ds-space-3);
}

.filter-panel .filter-actions {
    margin-top: var(--ds-space-1);
    padding-top: var(--ds-space-2);
    border-top: 1px solid var(--ds-border-subtle);
}

/* ------------------------------------------------------------------------- */
/* Tabelas — padrão enterprise (listagens financeiras)                        */
/* ------------------------------------------------------------------------- */

.table-wrap {
    background: var(--ds-surface-card);
    border-radius: var(--ds-radius-lg);
    border: 1px solid var(--ds-border-default);
    overflow-x: auto;
    overflow-y: auto;
    max-width: 100%;
    box-shadow: var(--ds-surface-inset-top), var(--ds-shadow-sm);
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: var(--ds-neutral-300) transparent;
}

@media (min-width: 1440px) {
    .table-wrap {
        scrollbar-color: var(--ds-neutral-400) var(--ds-neutral-100);
    }
}

.table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--ds-font-size-body);
    line-height: var(--ds-line-height-body);
    font-variant-numeric: tabular-nums;
}

.table th,
.table td {
    padding: var(--ds-table-cell-py, 0.7rem) var(--ds-table-cell-px, 0.95rem);
    text-align: left;
    border-bottom: 1px solid var(--ds-border-subtle);
    vertical-align: middle;
}

.table tbody tr {
    transition:
        background-color 0.14s ease,
        box-shadow 0.14s ease;
}

.table tbody tr:nth-child(even) td {
    background-color: var(--ds-table-zebra-bg);
}

.table tbody tr:hover td {
    background-color: var(--ds-table-row-hover-bg);
}

.table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background-color: var(--table-head-bg-solid);
    background-image: var(--table-head-bg);
    border-bottom: 1px solid var(--table-head-border);
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04);
    font-weight: var(--ds-font-weight-semibold);
    color: var(--table-head-text);
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    white-space: nowrap;
}

.table tr:last-child td {
    border-bottom: none;
}

.table-wrap.invoices-table-wrap .table thead th {
    background-color: var(--table-head-bg-solid);
    background-image: var(--table-head-bg);
    border-bottom-color: var(--table-head-border);
    color: var(--table-head-text);
}

/* Links de ação em células (evita estilizar links de cadastro no meio da linha) */
.main .table tbody td.nowrap a:not(.btn),
.main .table tbody td.receivables-td-actions a:not(.btn),
.main .table tbody td.payables-td-actions a:not(.btn),
.main .table tbody td:last-child:has(> a:only-child) > a:not(.btn) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.3rem 0.6rem;
    margin: 0.1rem 0;
    border-radius: var(--ds-radius-sm);
    font-size: var(--ds-font-size-caption);
    font-weight: var(--ds-font-weight-semibold);
    letter-spacing: var(--ds-letter-spacing-tight);
    text-decoration: none;
    color: var(--ds-color-primary);
    background: rgba(var(--ds-color-primary-rgb), 0.07);
    border: 1px solid rgba(var(--ds-color-primary-rgb), 0.18);
    transition:
        background-color 0.14s ease,
        border-color 0.14s ease,
        color 0.14s ease;
}

.main .table tbody td.nowrap a:not(.btn):hover,
.main .table tbody td.receivables-td-actions a:not(.btn):hover,
.main .table tbody td.payables-td-actions a:not(.btn):hover,
.main .table tbody td:last-child:has(> a:only-child) > a:not(.btn):hover {
    background: var(--ds-color-primary-muted);
    border-color: var(--ds-color-primary-border);
    color: var(--ds-color-primary-hover);
    text-decoration: none;
}

.parties-table-toolbar {
    padding: var(--ds-space-3) var(--ds-space-3);
    border-bottom: 1px solid var(--ds-border-subtle);
    background: var(--ds-surface-muted);
}

/* ------------------------------------------------------------------------- */
/* Modal                                                                     */
/* ------------------------------------------------------------------------- */

html.app-modal-open,
html.app-modal-open body {
    overflow: hidden;
}

.app-modal {
    position: fixed;
    inset: 0;
    z-index: 5000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: var(--ds-space-3);
    box-sizing: border-box;
}

.app-modal[hidden] {
    display: none !important;
}

.app-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.52);
    backdrop-filter: blur(4px);
    transition: opacity 0.2s ease;
}

.app-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(960px, 100%);
    max-height: min(92vh, 900px);
    margin-top: 2vh;
    background: var(--ds-surface-card);
    color: var(--ds-text-primary);
    border-radius: var(--ds-radius-lg);
    border: 1px solid var(--ds-border-default);
    box-shadow: var(--ds-surface-inset-top), var(--ds-shadow-xl);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: ui-modal-in 0.22s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes ui-modal-in {
    from {
        opacity: 0;
        transform: translateY(8px) scale(0.99);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.app-modal__close {
    position: absolute;
    top: var(--ds-space-2);
    right: var(--ds-space-2);
    z-index: 2;
    width: 2.25rem;
    height: 2.25rem;
    border: 1px solid transparent;
    border-radius: var(--ds-radius-sm);
    background: var(--ds-surface-muted);
    color: var(--ds-text-secondary);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition:
        background-color 0.14s ease,
        color 0.14s ease,
        border-color 0.14s ease;
}

.app-modal__close:hover {
    background: var(--ds-surface-hover);
    color: var(--ds-text-primary);
    border-color: var(--ds-border-default);
}

.app-modal__close:focus-visible {
    outline: none;
    box-shadow: var(--ds-shadow-ring-focus);
}

.app-modal__body {
    flex: 1;
    overflow: auto;
    padding: var(--ds-space-3) var(--ds-space-3) var(--ds-space-4);
    min-height: 4rem;
}

.app-modal__body .page-head {
    padding-top: 0.15rem;
    padding-right: 2.5rem;
}

.app-modal__error {
    flex-shrink: 0;
    padding: var(--ds-space-2) var(--ds-space-3);
    background: var(--ds-color-error-muted);
    color: var(--ds-color-error-hover);
    font-size: var(--ds-font-size-body);
    border-top: 1px solid var(--ds-color-error-border);
}

.app-modal__loading {
    padding: var(--ds-space-4) var(--ds-space-3);
    text-align: center;
    color: var(--ds-text-tertiary);
    font-size: var(--ds-font-size-body);
}

/* ------------------------------------------------------------------------- */
/* Alertas — flash + banners AppNotify                                       */
/* ------------------------------------------------------------------------- */

.flash {
    padding: var(--ds-space-2) var(--ds-space-3);
    border-radius: var(--ds-radius-md);
    margin-bottom: var(--ds-space-2);
    font-size: var(--ds-font-size-body);
    border: 1px solid transparent;
    box-shadow: var(--ds-surface-inset-top), var(--ds-shadow-xs);
}

.flash-err {
    background: var(--ds-color-error-muted);
    color: var(--ds-color-error-hover);
    border-color: var(--ds-color-error-border);
}

.flash-ok {
    background: var(--ds-color-success-muted);
    color: var(--ds-color-success-hover);
    border-color: var(--ds-color-success-border);
}

.flash-warn {
    background: var(--ds-color-warning-muted);
    color: var(--ds-color-warning-hover);
    border-color: var(--ds-color-warning-border);
}

.flash--info,
.flash-info {
    background: var(--ds-color-info-muted);
    color: #0c4a6e;
    border-color: var(--ds-color-info-border);
}

.app-alert-host:not(:empty) {
    margin: var(--ds-space-2) var(--ds-space-3) 0;
    width: 100%;
    max-width: min(100%, 56rem, 75ch);
    display: flex;
    flex-direction: column;
    gap: var(--ds-space-2);
}

.app-alert-banner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--ds-space-2);
    padding: var(--ds-space-2) var(--ds-space-3);
    border-radius: var(--ds-radius-md);
    font-size: var(--ds-font-size-body);
    line-height: var(--ds-line-height-body);
    border: 1px solid transparent;
    box-shadow: var(--ds-shadow-sm);
}

.app-alert-banner--error {
    background: var(--ds-color-error-muted);
    color: var(--ds-color-error-hover);
    border-color: var(--ds-color-error-border);
}

.app-alert-banner--warn {
    background: var(--ds-color-warning-muted);
    color: var(--ds-color-warning-hover);
    border-color: var(--ds-color-warning-border);
}

.app-alert-banner--info {
    background: var(--ds-color-info-muted);
    color: #0c4a6e;
    border-color: var(--ds-color-info-border);
}

.app-alert-banner__body {
    flex: 1;
    min-width: 0;
}

.app-alert-banner__close {
    flex-shrink: 0;
    border: 1px solid var(--ds-border-subtle);
    background: rgba(255, 255, 255, 0.5);
    width: 2rem;
    height: 2rem;
    border-radius: var(--ds-radius-sm);
    cursor: pointer;
    font-size: 1.15rem;
    line-height: 1;
    color: inherit;
    opacity: 0.85;
    transition: opacity 0.12s ease, background-color 0.12s ease;
}

.app-alert-banner__close:hover {
    opacity: 1;
    background: rgba(255, 255, 255, 0.9);
}

.app-alert-banner__close:focus-visible {
    outline: none;
    box-shadow: var(--ds-shadow-ring-focus);
}

.app-alert.app-alert--error {
    border-radius: var(--ds-radius-md);
}

/* ------------------------------------------------------------------------- */
/* Paginação (uso futuro ou manual em views)                                 */
/* ------------------------------------------------------------------------- */

.pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.35rem;
    margin-top: var(--ds-space-3);
    padding: var(--ds-space-2) var(--ds-space-3);
    border-radius: var(--ds-radius-md);
    border: 1px solid var(--ds-border-subtle);
    background: var(--ds-surface-muted);
    box-shadow: none;
}

.pagination__info {
    font-size: var(--ds-font-size-small);
    font-weight: var(--ds-font-weight-medium);
    color: var(--ds-text-secondary);
    margin-right: auto;
    padding-right: var(--ds-space-2);
}

.pagination__link,
.pagination__current {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    height: 2.25rem;
    padding: 0 0.45rem;
    border-radius: var(--ds-radius-sm);
    font-size: var(--ds-font-size-small);
    font-weight: var(--ds-font-weight-semibold);
    text-decoration: none;
    border: 1px solid var(--ds-border-default);
    background: var(--ds-surface-card);
    color: var(--ds-text-primary);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition:
        background-color 0.14s ease,
        border-color 0.14s ease,
        color 0.14s ease,
        box-shadow 0.14s ease;
}

.pagination__link:hover:not([aria-disabled="true"]) {
    background: var(--ds-surface-hover);
    border-color: rgba(var(--ds-color-primary-rgb), 0.25);
    color: var(--ds-color-primary);
    box-shadow: var(--ds-shadow-xs);
}

.pagination__link:focus-visible {
    outline: none;
    box-shadow: var(--ds-shadow-ring-focus);
}

.pagination__current {
    background: var(--ds-color-primary-muted);
    border-color: var(--ds-color-primary-border);
    color: var(--ds-color-primary-hover);
    font-weight: var(--ds-font-weight-semibold);
    cursor: default;
    box-shadow: none;
}

.pagination__ellipsis {
    display: inline-flex;
    align-items: center;
    padding: 0 var(--ds-space-1);
    color: var(--ds-text-tertiary);
    font-size: var(--ds-font-size-small);
    font-weight: var(--ds-font-weight-medium);
}

.pagination__link[aria-disabled="true"],
.pagination__link.is-disabled {
    opacity: 0.45;
    pointer-events: none;
    cursor: not-allowed;
}

/* Campos compactos (sobrescreve altura padrão) */
.main input.mini,
.app-modal__body input.mini {
    min-height: auto;
    padding: 0.25rem 0.4rem;
    font-size: var(--ds-font-size-small);
    max-width: 140px;
}

/* Inputs em linha (ex.: conciliação — tolerância) */
.main .inline input:not([type="checkbox"]),
.app-modal__body .inline input:not([type="checkbox"]) {
    width: auto;
    max-width: 100%;
    flex: 0 1 auto;
    min-height: var(--ds-input-height-sm);
}

/* ------------------------------------------------------------------------- */
/* Acessibilidade: menos movimento                                           */
/* ------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    .btn,
    .card,
    .table tbody tr,
    .table tbody td,
    .app-modal__backdrop,
    .app-modal__dialog,
    .pagination__link,
    .badge,
    .main input,
    .main textarea,
    .main select,
    .app-modal__body input,
    .app-modal__body textarea,
    .app-modal__body select {
        transition: none;
    }

    .app-modal__dialog {
        animation: none;
    }

    .btn:active:not(:disabled):not([aria-disabled="true"]) {
        opacity: 1;
    }
}