/* ==========================================================================
   Condolab Design System — Componentes
   Botões, pills, badges, cards, KPI, tabela (GridView), formulários,
   estado vazio, abas, dropdown, modal e progresso.
   Todas as classes usam prefixo "ds-" para não colidir com CSS legado.
   Depende de ds-tokens.css.
   ========================================================================== */

/* ==========================================================================
   Botões — .ds-btn (asp:Button / asp:LinkButton / <button> / <a>)
   ========================================================================== */
.ds-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    height: var(--ds-control-height);
    padding: 0 var(--ds-space-3);
    border: 1px solid transparent;
    border-radius: var(--ds-radius);
    background: transparent;
    color: var(--ds-text);
    font-family: var(--ds-font); font-size: var(--ds-fs-14); font-weight: var(--ds-fw-medium); line-height: 1;
    white-space: nowrap; text-decoration: none !important;
    cursor: pointer; user-select: none;
    -webkit-appearance: none; appearance: none;
    transition: background-color var(--ds-transition), border-color var(--ds-transition), box-shadow var(--ds-transition), color var(--ds-transition);
}
.ds-btn:focus { outline: none; }
.ds-btn:focus-visible { box-shadow: var(--ds-focus-ring); }
.ds-btn .ds-icon { margin-left: -2px; }

/* Primário */
.ds-btn--primary { background: var(--ds-primary); border-color: var(--ds-primary); color: var(--ds-on-primary) !important; box-shadow: var(--ds-shadow-btn); }
.ds-btn--primary:hover { background: var(--ds-primary-hover); border-color: var(--ds-primary-hover); color: var(--ds-on-primary) !important; }
.ds-btn--primary:active { background: var(--ds-primary-active); border-color: var(--ds-primary-active); }

/* Secundário */
.ds-btn--secondary { background: var(--ds-bg); border-color: var(--ds-border); color: var(--ds-text) !important; box-shadow: 0 1px 1px rgba(0, 0, 0, .06); }
.ds-btn--secondary:hover { background: var(--ds-bg-subtle); border-color: var(--ds-border-strong); color: var(--ds-text) !important; }
.ds-btn--secondary:active { background: var(--ds-bg-muted); }

/* Ghost */
.ds-btn--ghost { color: var(--ds-text-secondary) !important; }
.ds-btn--ghost:hover { background: var(--ds-bg-subtle); color: var(--ds-text) !important; }

/* Link (texto na cor primária) */
.ds-btn--link { height: auto; padding: 0; color: var(--ds-primary) !important; }
.ds-btn--link:hover { color: var(--ds-primary-hover) !important; text-decoration: underline !important; }

/* Perigo */
.ds-btn--danger { background: var(--ds-danger-solid); border-color: var(--ds-danger-solid); color: #fff !important; box-shadow: var(--ds-shadow-btn); }
.ds-btn--danger:hover { background: var(--ds-danger-solid-hover); border-color: var(--ds-danger-solid-hover); color: #fff !important; }
.ds-btn--danger:focus-visible { box-shadow: 0 0 0 3px rgba(223, 27, 65, .3); }

/* Tamanhos e formatos */
.ds-btn--sm { height: var(--ds-control-height-sm); padding: 0 10px; font-size: var(--ds-fs-13); }
.ds-btn--lg { height: 40px; padding: 0 var(--ds-space-4); font-size: var(--ds-fs-14); }
.ds-btn--block { display: flex; width: 100%; }
.ds-btn--icon { width: var(--ds-control-height); padding: 0; }
.ds-btn--icon .ds-icon { margin: 0; }
.ds-btn--icon.ds-btn--sm { width: var(--ds-control-height-sm); }
.ds-btn--round { border-radius: 50%; }

/* Desabilitado (atributo, classe do ASP.NET 4 ou aria) */
.ds-btn:disabled, .ds-btn[disabled], .ds-btn.aspNetDisabled, .ds-btn[aria-disabled="true"] {
    opacity: .5; cursor: not-allowed; box-shadow: none; pointer-events: none;
}

.ds-btn-group { display: inline-flex; }
.ds-btn-group > .ds-btn:not(:first-child) { margin-left: -1px; border-top-left-radius: 0; border-bottom-left-radius: 0; }
.ds-btn-group > .ds-btn:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }

/* ==========================================================================
   Pills de filtro — .ds-pill
   ========================================================================== */
.ds-pills { position: relative; display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--ds-space-2); }

.ds-pill {
    display: inline-flex; align-items: center; gap: 6px;
    height: 28px; padding: 0 10px;
    border: 1px solid var(--ds-border); border-radius: var(--ds-radius-pill);
    background: var(--ds-bg);
    color: var(--ds-text-secondary) !important;
    font-family: var(--ds-font); font-size: var(--ds-fs-13); font-weight: var(--ds-fw-medium); line-height: 1;
    white-space: nowrap; text-decoration: none !important; cursor: pointer;
    transition: border-color var(--ds-transition), color var(--ds-transition), background-color var(--ds-transition);
}
.ds-pill:hover { border-color: var(--ds-border-strong); color: var(--ds-text) !important; }
.ds-pill:focus-visible { outline: none; box-shadow: var(--ds-focus-ring); }
.ds-pill .ds-icon { width: 14px; height: 14px; }
.ds-pill.is-active { border-color: var(--ds-text); color: var(--ds-text) !important; font-weight: var(--ds-fw-semibold); }
.ds-pill--dashed { border-style: dashed; }

/* Variação rótulo | valor: "Período | Últimos 7 dias ▾" */
.ds-pill__label { color: var(--ds-text-secondary); font-weight: var(--ds-fw-medium); }
.ds-pill__sep { width: 1px; height: 14px; background: var(--ds-border); }
.ds-pill__value { color: var(--ds-primary); font-weight: var(--ds-fw-semibold); }

/* Pills geradas por asp:RadioButtonList RepeatLayout="Flow" com CssClass="ds-pills" */
.ds-pills input[type="radio"], .ds-pills input[type="checkbox"] {
    position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none;
}
.ds-pills input[type="radio"] + label, .ds-pills input[type="checkbox"] + label {
    display: inline-flex; align-items: center;
    height: 28px; padding: 0 10px; margin: 0;
    border: 1px solid var(--ds-border); border-radius: var(--ds-radius-pill);
    color: var(--ds-text-secondary); font-size: var(--ds-fs-13); font-weight: var(--ds-fw-medium);
    cursor: pointer; white-space: nowrap;
}
.ds-pills input + label:hover { border-color: var(--ds-border-strong); color: var(--ds-text); }
.ds-pills input:checked + label { border-color: var(--ds-text); color: var(--ds-text); font-weight: var(--ds-fw-semibold); }
.ds-pills input:focus-visible + label { box-shadow: var(--ds-focus-ring); }
.ds-pills br { display: none; }

/* ==========================================================================
   Badges de status — .ds-badge
   ========================================================================== */
.ds-badge {
    display: inline-flex; align-items: center; gap: 4px;
    height: 20px; padding: 0 6px;
    border-radius: var(--ds-radius-sm);
    font-size: var(--ds-fs-12); font-weight: var(--ds-fw-medium); line-height: 1;
    white-space: nowrap;
    background: var(--ds-neutral-bg); color: var(--ds-neutral);
}
.ds-badge .ds-icon { width: 12px; height: 12px; stroke-width: 2; }
.ds-badge--success { background: var(--ds-success-bg); color: var(--ds-success); }
.ds-badge--warning { background: var(--ds-warning-bg); color: var(--ds-warning); }
.ds-badge--danger  { background: var(--ds-danger-bg);  color: var(--ds-danger); }
.ds-badge--neutral { background: var(--ds-neutral-bg); color: var(--ds-neutral); }
.ds-badge--info    { background: var(--ds-info-bg);    color: var(--ds-info); }
.ds-badge--primary { background: var(--ds-primary-soft); color: var(--ds-primary); }
.ds-badge:empty { display: none; }

/* ==========================================================================
   Avatar
   ========================================================================== */
.ds-avatar {
    display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
    width: 28px; height: 28px; border-radius: var(--ds-radius);
    background: var(--ds-primary); color: var(--ds-on-primary);
    font-size: var(--ds-fs-13); font-weight: var(--ds-fw-semibold); text-transform: uppercase;
}
.ds-avatar--round { border-radius: 50%; }
.ds-avatar--sm { width: 24px; height: 24px; font-size: var(--ds-fs-12); }
.ds-avatar--soft { background: var(--ds-primary-soft); color: var(--ds-primary); }

/* ==========================================================================
   Cards — .ds-card / grid — .ds-grid
   ========================================================================== */
.ds-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: var(--ds-space-4);
}
.ds-grid--sm { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }

.ds-card {
    display: flex; flex-direction: column;
    padding: var(--ds-space-5);
    background: var(--ds-bg);
    border-radius: var(--ds-radius-lg);
    box-shadow: var(--ds-shadow-card);
    min-width: 0;
}
.ds-card--flush { padding: 0; }
.ds-card--interactive { cursor: pointer; transition: box-shadow var(--ds-transition); color: inherit !important; }
.ds-card--interactive:hover { box-shadow: 0 4px 12px rgba(0, 0, 0, .08), 0 0 0 1px var(--ds-border-strong); }

.ds-card__header { display: flex; align-items: center; justify-content: space-between; gap: var(--ds-space-2); }
.ds-card__title {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: var(--ds-fs-14); font-weight: var(--ds-fw-medium); color: var(--ds-text);
}
.ds-card__help { color: var(--ds-text-tertiary); cursor: help; display: inline-flex; }
.ds-card__help .ds-icon { width: 14px; height: 14px; }
.ds-card__value {
    margin-top: var(--ds-space-2);
    font-size: var(--ds-fs-24); font-weight: var(--ds-fw-semibold); line-height: 32px;
    font-variant-numeric: tabular-nums; letter-spacing: -.01em;
}
.ds-card__compare { margin-top: 2px; color: var(--ds-text-secondary); font-size: var(--ds-fs-13); font-variant-numeric: tabular-nums; }
.ds-card__chart { position: relative; height: 120px; margin-top: var(--ds-space-4); }
.ds-card__body { margin-top: var(--ds-space-3); color: var(--ds-text-secondary); font-size: var(--ds-fs-14); flex: 1 1 auto; }
.ds-card__footer {
    display: flex; align-items: center; justify-content: space-between; gap: var(--ds-space-2);
    margin-top: var(--ds-space-4); padding-top: var(--ds-space-3);
    border-top: 1px solid var(--ds-border);
    font-size: var(--ds-fs-13); color: var(--ds-text-secondary);
}
.ds-card__footer a { font-weight: var(--ds-fw-medium); }

.ds-card__icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; border-radius: var(--ds-radius);
    background: var(--ds-primary-soft); color: var(--ds-primary);
}

/* Legenda HTML de gráfico */
.ds-legend { display: flex; flex-wrap: wrap; gap: var(--ds-space-4); margin-top: var(--ds-space-3); font-size: var(--ds-fs-12); color: var(--ds-text-secondary); }
.ds-legend__item { display: inline-flex; align-items: center; gap: 6px; }
.ds-legend__swatch { width: 14px; height: 0; border-top: 2px solid var(--ds-primary); }
.ds-legend__swatch--prev { border-top: 2px dashed var(--ds-text-tertiary); }

/* Variação de tendência */
.ds-trend { display: inline-flex; align-items: center; gap: 2px; font-size: var(--ds-fs-13); font-weight: var(--ds-fw-medium); }
.ds-trend--up { color: var(--ds-success); }
.ds-trend--down { color: var(--ds-danger); }

/* ==========================================================================
   Bloco KPI de destaque (topo do dashboard, sem card)
   ========================================================================== */
.ds-kpi { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--ds-space-8); margin-bottom: var(--ds-space-8); }
.ds-kpi__item { min-width: 0; }
.ds-kpi__select {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 0; border: 0; background: transparent; cursor: pointer;
    color: var(--ds-text-secondary); font: inherit; font-size: var(--ds-fs-14); font-weight: var(--ds-fw-medium);
}
.ds-kpi__select:hover { color: var(--ds-text); }
.ds-kpi__value {
    display: block; margin-top: var(--ds-space-1);
    font-size: var(--ds-fs-28); font-weight: var(--ds-fw-semibold); line-height: 36px;
    font-variant-numeric: tabular-nums; letter-spacing: -.02em;
}
.ds-kpi__meta { color: var(--ds-text-secondary); font-size: var(--ds-fs-13); }

/* ==========================================================================
   Tabela — .ds-table (asp:GridView CssClass="ds-table" GridLines="None")
   ========================================================================== */
.ds-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

table.ds-table {
    width: 100%;
    border-collapse: collapse !important;
    border: 0 !important;
    border-spacing: 0;
    background: var(--ds-bg);
    font-size: var(--ds-fs-13); /* itens das grades: 13px (12px nas compactas) */
    line-height: 1.35;
    font-variant-numeric: tabular-nums;
}
table.ds-table > thead > tr > th,
table.ds-table > tbody > tr > th,
table.ds-table > tbody > tr.ds-table__head > td,
table.ds-table > tr > th {
    height: 36px;
    padding: 0 var(--ds-space-3);
    border: 0 !important;
    border-bottom: 1px solid var(--ds-border) !important;
    background: var(--ds-bg);
    color: var(--ds-text-secondary);
    font-size: var(--ds-fs-12); font-weight: var(--ds-fw-medium); text-align: left; white-space: nowrap;
}
table.ds-table th a { color: var(--ds-text-secondary) !important; }
table.ds-table th a:hover { color: var(--ds-text) !important; }

table.ds-table > tbody > tr > td,
table.ds-table > tr > td {
    height: 38px;
    padding: 6px var(--ds-space-3);
    border: 0 !important;
    border-bottom: 1px solid var(--ds-border) !important;
    color: var(--ds-text);
    vertical-align: middle;
}
table.ds-table > tbody > tr:hover > td { background: var(--ds-bg-subtle); }
table.ds-table > tbody > tr.ds-pager:hover > td,
table.ds-table > tbody > tr.ds-pager > td { background: transparent; }

/* Linha selecionada (SelectedRowStyle-CssClass="is-selected") */
table.ds-table > tbody > tr.is-selected > td { background: var(--ds-primary-soft); }

/* Colunas utilitárias (ItemStyle-CssClass) */
table.ds-table .ds-col-check { width: 40px; padding-right: 0; }
table.ds-table .ds-col-money, table.ds-table .ds-col-num { text-align: right; white-space: nowrap; }
table.ds-table td.ds-col-money { font-weight: var(--ds-fw-semibold); }
table.ds-table .ds-col-center { text-align: center; }
table.ds-table .ds-col-actions { width: 1%; text-align: right; white-space: nowrap; }
table.ds-table .ds-col-muted { color: var(--ds-text-secondary); }
table.ds-table .ds-col-nowrap { white-space: nowrap; }
/* Grades de pesquisa (grvConsulta / grvPesquisa*): uma linha por registro, sem quebrar nomes de imóvel,
   proprietário etc.; se não couber, o .ds-table-wrap rola na horizontal. ds-col-wrap libera uma coluna longa. */
table.ds-table.ds-table--nowrap > thead > tr > th,
table.ds-table.ds-table--nowrap > tbody > tr > td { white-space: nowrap; }
table.ds-table.ds-table--nowrap > thead > tr > th,
table.ds-table.ds-table--nowrap > tbody > tr > td { padding-left: var(--ds-space-2); padding-right: var(--ds-space-2); }
table.ds-table.ds-table--nowrap > tbody > tr > td.ds-col-wrap { white-space: normal; min-width: 200px; }
/* se a grade rolar na horizontal, a coluna de ações fica fixa à direita (sempre visível) */
table.ds-table.ds-table--nowrap > tbody > tr > td.ds-col-actions { position: sticky; right: 0; z-index: 1; background: var(--ds-bg); }
table.ds-table.ds-table--nowrap > tbody > tr:hover > td.ds-col-actions { background: var(--ds-bg-subtle); }
/* ...e NUNCA mais largas que a área disponível (sem rolagem horizontal): quando a grade não cabe, o ds.js
   (ajustarGradesNowrap) mede as colunas, mantém as curtas na largura natural (códigos, datas, números, ações,
   checkbox, etiquetas) e apara as colunas de texto mais largas até caber (table-layout: fixed + <colgroup>).
   O texto cortado termina em reticências e ganha o conteúdo completo no title. */
table.ds-table.ds-table--nowrap > tbody > tr > td { overflow: hidden; text-overflow: ellipsis; }
table.ds-table.ds-table--nowrap > tbody > tr > td.ds-col-actions,
table.ds-table.ds-table--nowrap > tbody > tr > td.ds-col-check { overflow: visible; }
table.ds-table.ds-table--nowrap.is-ajustada { table-layout: fixed; width: 100%; }
table.ds-table.ds-table--nowrap.is-ajustada > thead > tr > th { overflow: hidden; text-overflow: ellipsis; }
table.ds-table.ds-table--nowrap > tbody > tr > td.ds-table__empty,
table.ds-table.ds-table--nowrap > tbody > tr.ds-table__empty > td { white-space: normal; }

/* Linha vazia (EmptyDataRowStyle) */
table.ds-table .ds-table__empty td { height: auto; padding: var(--ds-space-8) var(--ds-space-3); text-align: center; color: var(--ds-text-secondary); }

/* Rodapé de paginação — próprio (fora do GridView) */
.ds-table-footer {
    display: flex; align-items: center; justify-content: space-between; gap: var(--ds-space-3);
    padding: var(--ds-space-3) 0;
    font-size: var(--ds-fs-13); color: var(--ds-text-secondary);
}
.ds-table-footer strong { color: var(--ds-text); font-weight: var(--ds-fw-semibold); }

/* Pager do GridView (PagerStyle-CssClass="ds-pager") */
tr.ds-pager > td { padding: var(--ds-space-3) 0 0 !important; border-bottom: 0 !important; height: auto !important; }
tr.ds-pager table { border-collapse: separate; border-spacing: 4px 0; margin-left: auto; }
tr.ds-pager table td { padding: 0; border: 0 !important; height: auto !important; }
tr.ds-pager a, tr.ds-pager span {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 28px; height: 28px; padding: 0 8px;
    border: 1px solid var(--ds-border); border-radius: var(--ds-radius);
    background: var(--ds-bg);
    color: var(--ds-text) !important; font-size: var(--ds-fs-13); font-weight: var(--ds-fw-medium);
    text-decoration: none !important;
}
tr.ds-pager a:hover { background: var(--ds-bg-subtle); border-color: var(--ds-border-strong); }
tr.ds-pager span { border-color: var(--ds-text); font-weight: var(--ds-fw-semibold); }

/* Paginação simples (setas) */
.ds-pagination { display: inline-flex; gap: var(--ds-space-1); }

/* ==========================================================================
   Formulários — .ds-field / .ds-label / .ds-input / .ds-select
   ========================================================================== */
.ds-form { display: grid; gap: var(--ds-space-4); }
.ds-form-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--ds-space-4) var(--ds-space-5); }
.ds-form-section { padding-bottom: var(--ds-space-6); margin-bottom: var(--ds-space-6); border-bottom: 1px solid var(--ds-border); }
.ds-form-actions { display: flex; align-items: center; gap: var(--ds-space-2); padding-top: var(--ds-space-2); }

.ds-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ds-field--inline { flex-direction: row; align-items: center; }
.ds-field--span-2 { grid-column: 1 / -1; } /* linha inteira (seguro em grid auto-fill, inclusive no mobile) */
.ds-field--span2c { grid-column: span 2; }  /* duas colunas (no mobile: linha inteira) */
.ds-form-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 767.98px) {
    .ds-field--span2c { grid-column: 1 / -1; }
    .ds-form-grid--2 { grid-template-columns: minmax(0, 1fr); }
}
/* Popups (550–650px de largura): a viewport é estreita, mas há espaço para 2 colunas; sem isso os
   filtros dos relatórios passam da altura da janela. Abaixo de 480px volta a 1 coluna. */
@media (min-width: 480px) and (max-width: 767.98px) {
    .ds-popup .ds-form-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ds-popup .ds-field--span2c { grid-column: span 2; }
}

.ds-label, label.ds-label, span.ds-label {
    display: block;
    font-size: var(--ds-fs-13); font-weight: var(--ds-fw-medium); color: var(--ds-text);
}
.ds-label__optional { color: var(--ds-text-secondary); font-weight: var(--ds-fw-regular); }
.ds-hint { font-size: var(--ds-fs-12); color: var(--ds-text-secondary); }

.ds-input, .ds-select, .ds-textarea {
    display: block;
    width: 100%;
    height: var(--ds-control-height);
    padding: 0 10px;
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius);
    background-color: var(--ds-input-bg);
    color: var(--ds-text);
    font-family: var(--ds-font); font-size: var(--ds-fs-14); line-height: 20px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .03);
    transition: border-color var(--ds-transition), box-shadow var(--ds-transition);
    -webkit-appearance: none; appearance: none;
}
.ds-input::placeholder, .ds-textarea::placeholder { color: var(--ds-text-tertiary); }
.ds-input:hover, .ds-select:hover, .ds-textarea:hover { border-color: var(--ds-border-strong); }
.ds-input:focus, .ds-select:focus, .ds-textarea:focus {
    outline: none; border-color: var(--ds-primary); box-shadow: var(--ds-focus-ring);
}
.ds-input:disabled, .ds-select:disabled, .ds-textarea:disabled,
.ds-input[readonly], .ds-input.aspNetDisabled, .ds-select.aspNetDisabled {
    background-color: var(--ds-bg-subtle); color: var(--ds-text-secondary); cursor: not-allowed;
}
.ds-input--lg { height: 40px; font-size: var(--ds-fs-14); }
.ds-input--sm { height: var(--ds-control-height-sm); font-size: var(--ds-fs-13); }

.ds-textarea { height: auto; min-height: 88px; padding: 6px 10px; resize: vertical; }

.ds-select {
    padding-right: 32px;
    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='%23697386' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 15 5 5 5-5'/%3E%3Cpath d='m7 9 5-5 5 5'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 8px center; background-size: 14px;
}
select.ds-select[multiple] { height: auto; background-image: none; padding: 4px; }

/* Campo inválido: aria-invalid ou classe aplicada no servidor */
.ds-input.is-invalid, .ds-select.is-invalid, .ds-textarea.is-invalid,
.ds-input[aria-invalid="true"] { border-color: var(--ds-danger-solid); }
.ds-input.is-invalid:focus { box-shadow: 0 0 0 3px rgba(223, 27, 65, .25); }

/* Input com ícone */
.ds-input-group { position: relative; }
.ds-input-group > .ds-icon { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--ds-text-secondary); pointer-events: none; }
.ds-input-group > .ds-input { padding-left: 32px; }
.ds-input-group > .ds-input-group__action { position: absolute; right: 2px; top: 50%; transform: translateY(-50%); }

/* Mensagens dos validators (CssClass="ds-field-error" Display="Dynamic") */
.ds-field-error {
    display: block;
    margin-top: 2px;
    font-size: var(--ds-fs-12); font-weight: var(--ds-fw-medium);
    color: var(--ds-danger) !important;
}

/* asp:ValidationSummary CssClass="ds-validation-summary" */
.ds-validation-summary {
    padding: var(--ds-space-3) var(--ds-space-4);
    margin-bottom: var(--ds-space-4);
    border-radius: var(--ds-radius-lg);
    background: var(--ds-danger-bg); color: var(--ds-danger) !important;
    font-size: var(--ds-fs-13);
}
.ds-validation-summary ul { margin: var(--ds-space-1) 0 0; padding-left: 18px; }

/* Checkbox / radio (asp:CheckBox CssClass="ds-check" envolve input + label num span) */
.ds-check { display: inline-flex; align-items: center; gap: var(--ds-space-2); font-size: var(--ds-fs-14); cursor: pointer; }
.ds-check input[type="checkbox"], .ds-check input[type="radio"],
input.ds-checkbox, .ds-table input[type="checkbox"] {
    width: 16px; height: 16px; margin: 0;
    accent-color: var(--ds-primary);
    cursor: pointer;
}
.ds-check label { cursor: pointer; }

/* Switch */
.ds-switch { position: relative; display: inline-flex; align-items: center; gap: var(--ds-space-2); cursor: pointer; }
.ds-switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ds-switch__track { width: 32px; height: 18px; border-radius: 999px; background: var(--ds-border-strong); position: relative; transition: background var(--ds-transition); }
.ds-switch__track::after { content: ""; position: absolute; left: 2px; top: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .2); transition: transform var(--ds-transition); }
.ds-switch input:checked + .ds-switch__track { background: var(--ds-primary); }
.ds-switch input:checked + .ds-switch__track::after { transform: translateX(14px); }
.ds-switch input:focus-visible + .ds-switch__track { box-shadow: var(--ds-focus-ring); }

/* ==========================================================================
   Estado vazio — .ds-empty
   ========================================================================== */
.ds-empty {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: var(--ds-space-12) var(--ds-space-6);
    text-align: center;
}
.ds-empty__icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 48px; height: 48px; margin-bottom: var(--ds-space-4);
    border-radius: var(--ds-radius-lg);
    background: var(--ds-bg-subtle); color: var(--ds-text-secondary);
}
.ds-empty__icon--primary { background: var(--ds-primary-soft); color: var(--ds-primary); }
.ds-empty__title { font-size: var(--ds-fs-16); font-weight: var(--ds-fw-semibold); color: var(--ds-text); }
.ds-empty__desc { max-width: 420px; margin: var(--ds-space-2) 0 var(--ds-space-5); color: var(--ds-text-secondary); font-size: var(--ds-fs-14); }
.ds-empty__desc:last-child { margin-bottom: 0; }

/* ==========================================================================
   Abas — .ds-tabs
   ========================================================================== */
.ds-tabs {
    display: flex; gap: var(--ds-space-5);
    margin: 0 0 var(--ds-space-6); padding: 0;
    border-bottom: 1px solid var(--ds-border);
    list-style: none; overflow-x: auto; scrollbar-width: none;
}
.ds-tabs::-webkit-scrollbar { display: none; }
.ds-tab {
    position: relative;
    display: inline-flex; align-items: center; gap: 6px;
    padding: 0 0 var(--ds-space-3);
    margin-bottom: -1px;
    border: 0; border-bottom: 2px solid transparent;
    background: transparent;
    color: var(--ds-text-secondary) !important;
    font-family: var(--ds-font); font-size: var(--ds-fs-14); font-weight: var(--ds-fw-medium);
    white-space: nowrap; text-decoration: none !important; cursor: pointer;
}
.ds-tab:hover { color: var(--ds-text) !important; }
.ds-tab.is-active, .ds-tab[aria-selected="true"] { color: var(--ds-primary) !important; border-bottom-color: var(--ds-primary); }
.ds-tab:focus-visible { outline: none; box-shadow: none; border-radius: 0; text-decoration: underline !important; }
.ds-tab__count { padding: 0 6px; border-radius: var(--ds-radius-pill); background: var(--ds-bg-muted); color: var(--ds-text-secondary); font-size: var(--ds-fs-12); line-height: 18px; }

.ds-tabpanel[hidden] { display: none; }

/* ==========================================================================
   Dropdown — .ds-dropdown
   ========================================================================== */
.ds-dropdown { position: relative; display: inline-flex; }
.ds-dropdown--block { display: flex; }
.ds-dropdown__menu {
    position: absolute; top: calc(100% + 4px); left: 0;
    min-width: 220px;
    margin: 0; padding: var(--ds-space-1);
    list-style: none;
    background: var(--ds-bg);
    border-radius: var(--ds-radius-lg);
    box-shadow: var(--ds-shadow-dropdown), 0 0 0 1px var(--ds-border);
    z-index: var(--ds-z-dropdown);
}
.ds-dropdown__menu[hidden] { display: none; }
.ds-dropdown__menu--end { left: auto; right: 0; }
.ds-dropdown__menu--full { left: 0; right: 0; }
.ds-dropdown__header { padding: var(--ds-space-2) var(--ds-space-2) var(--ds-space-1); font-size: var(--ds-fs-12); color: var(--ds-text-secondary); }
.ds-dropdown__header strong { display: block; font-size: var(--ds-fs-14); color: var(--ds-text); font-weight: var(--ds-fw-semibold); }
.ds-dropdown__item {
    display: flex; align-items: center; gap: var(--ds-space-2);
    width: 100%; min-height: 32px; padding: 6px var(--ds-space-2);
    border: 0; border-radius: var(--ds-radius); background: transparent;
    color: var(--ds-text) !important; font-family: var(--ds-font); font-size: var(--ds-fs-14); text-align: left;
    text-decoration: none !important; cursor: pointer;
}
.ds-dropdown__item:hover, .ds-dropdown__item:focus-visible { background: var(--ds-bg-subtle); outline: none; box-shadow: none; }
.ds-dropdown__item .ds-icon { color: var(--ds-text-secondary); }
.ds-dropdown__item--danger { color: var(--ds-danger) !important; }
.ds-dropdown__item--danger .ds-icon { color: var(--ds-danger); }
.ds-dropdown__item.is-disabled { color: var(--ds-text-tertiary) !important; cursor: not-allowed; }
.ds-dropdown__item.is-disabled:hover { background: transparent; }
.ds-dropdown__divider { height: 1px; margin: var(--ds-space-1) 0; background: var(--ds-border); }
.ds-dropdown__menu .ds-empty { width: 280px; padding: var(--ds-space-6) var(--ds-space-4); }

/* ==========================================================================
   Modal — .ds-modal (também serve de PopupControlExtender / ModalPopupExtender)
   ========================================================================== */
.ds-modal {
    position: fixed; inset: 0;
    display: flex; align-items: flex-start; justify-content: center;
    padding: 10vh var(--ds-space-4) var(--ds-space-4);
    background: var(--ds-overlay);
    z-index: var(--ds-z-modal);
}
.ds-modal[hidden] { display: none; }
.ds-modal__dialog {
    width: 100%; max-width: 520px;
    max-height: 80vh; display: flex; flex-direction: column;
    background: var(--ds-bg);
    border-radius: var(--ds-radius-xl);
    box-shadow: var(--ds-shadow-modal);
    animation: ds-pop 140ms ease-out;
}
.ds-modal__dialog--lg { max-width: 760px; }
.ds-modal__header {
    display: flex; align-items: center; justify-content: space-between; gap: var(--ds-space-3);
    padding: var(--ds-space-4) var(--ds-space-5);
    border-bottom: 1px solid var(--ds-border);
}
.ds-modal__title { font-size: var(--ds-fs-16); font-weight: var(--ds-fw-semibold); }
.ds-modal__body { padding: var(--ds-space-5); overflow-y: auto; color: var(--ds-text); }
.ds-modal__footer {
    display: flex; justify-content: flex-end; gap: var(--ds-space-2);
    padding: var(--ds-space-3) var(--ds-space-5);
    border-top: 1px solid var(--ds-border);
    background: var(--ds-bg-subtle);
    border-radius: 0 0 var(--ds-radius-xl) var(--ds-radius-xl);
}

@keyframes ds-pop { from { opacity: 0; transform: translateY(6px) scale(.98); } to { opacity: 1; transform: none; } }

/* ==========================================================================
   Progresso (asp:UpdateProgress) e spinner
   ========================================================================== */
.ds-progress {
    position: fixed; inset: 0;
    display: flex; align-items: center; justify-content: center;
    background: var(--ds-veil);
    z-index: var(--ds-z-progress);
}
.ds-progress__box {
    display: inline-flex; align-items: center; gap: var(--ds-space-3);
    padding: var(--ds-space-3) var(--ds-space-5);
    background: var(--ds-bg);
    border-radius: var(--ds-radius-lg);
    box-shadow: var(--ds-shadow-dropdown), 0 0 0 1px var(--ds-border);
    font-size: var(--ds-fs-14); font-weight: var(--ds-fw-medium); color: var(--ds-text);
}
.ds-spinner {
    width: 18px; height: 18px; flex: 0 0 auto;
    border: 2px solid var(--ds-primary-soft);
    border-top-color: var(--ds-primary);
    border-radius: 50%;
    animation: ds-spin 700ms linear infinite;
}
.ds-spinner--lg { width: 28px; height: 28px; border-width: 3px; }
@keyframes ds-spin { to { transform: rotate(360deg); } }

/* Barra fina no topo durante postback parcial */
.ds-topline { position: fixed; left: 0; right: 0; top: 0; height: 2px; z-index: var(--ds-z-progress); overflow: hidden; }
.ds-topline::after { content: ""; position: absolute; top: 0; left: -40%; width: 40%; height: 100%; background: var(--ds-primary); animation: ds-topline 1s ease-in-out infinite; }
@keyframes ds-topline { to { left: 100%; } }

/* ==========================================================================
   Lista de definição (detalhes "rótulo: valor")
   ========================================================================== */
.ds-dl { display: grid; grid-template-columns: minmax(120px, 200px) 1fr; gap: var(--ds-space-2) var(--ds-space-4); margin: 0; font-size: var(--ds-fs-14); }
.ds-dl dt { color: var(--ds-text-secondary); }
.ds-dl dd { margin: 0; color: var(--ds-text); }

/* Código / tokens no StyleGuide */
.ds-code { font-family: var(--ds-font-mono); font-size: var(--ds-fs-12); padding: 1px 6px; border-radius: var(--ds-radius-sm); background: var(--ds-bg-subtle); color: var(--ds-text); }

/* ==========================================================================
   Tabela compacta (listas auxiliares, critérios)
   ========================================================================== */
table.ds-table--compact > tbody > tr > td { height: 32px; padding-top: 4px; padding-bottom: 4px; font-size: var(--ds-fs-12); }

/* ==========================================================================
   Construtor de critérios de pesquisa (wucPesquisa / wucPesquisaAux)
   ========================================================================== */
.ds-query { display: flex; flex-direction: column; gap: var(--ds-space-3); min-width: 0; }
.ds-query__row { display: grid; grid-template-columns: minmax(160px, 1.2fr) minmax(120px, .8fr) minmax(160px, 1.4fr) minmax(110px, .7fr); gap: var(--ds-space-3); }
.ds-query__row--3 { grid-template-columns: minmax(140px, 1.2fr) minmax(110px, .8fr) minmax(140px, 1.4fr); }
.ds-query__criteria { border-top: 1px solid var(--ds-border) !important; }
.ds-query__criteria td.ds-query__col-strong { font-weight: var(--ds-fw-medium); }
table.ds-query__criteria tr.ds-query__empty > td { height: auto; padding: var(--ds-space-3) 0; border-bottom: 0 !important; color: var(--ds-text-secondary); font-size: var(--ds-fs-13); }
table.ds-query__criteria > tbody > tr:hover > td { background: transparent; }

/* Painel de busca: critérios + botões */
.ds-searchpanel { display: flex; align-items: flex-end; gap: var(--ds-space-4); margin-bottom: var(--ds-space-6); }
.ds-searchpanel > .ds-query { flex: 1 1 auto; }
.ds-searchpanel > .ds-field { flex: 1 1 auto; max-width: 520px; } /* filtro simples (um campo) no lugar do wucPesquisa */
.ds-searchpanel__actions { display: flex; flex-direction: column; gap: var(--ds-space-2); padding-bottom: 2px; }
.ds-searchpanel__actions .ds-btn { justify-content: flex-start; }

@media (max-width: 767.98px) {
    .ds-query__row, .ds-query__row--3 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .ds-searchpanel { flex-direction: column; align-items: stretch; }
    .ds-searchpanel__actions { flex-direction: row; }
}

/* ==========================================================================
   Campo com botões auxiliares (ex.: Estado [select] [+] [↻])
   ========================================================================== */
.ds-input-row { display: flex; align-items: center; gap: var(--ds-space-1); }
.ds-input-row > .ds-input, .ds-input-row > .ds-select { flex: 1 1 auto; min-width: 0; }

/* Ícone em asp:Button (input não aceita SVG interno): fundo com SVG Lucide */
input.ds-btn--ico { width: var(--ds-control-height); padding: 0; background-repeat: no-repeat; background-position: center; background-size: 16px; font-size: 0; color: transparent !important; }
input.ds-btn--ico-plus { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234F566B' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M12 5v14'/%3E%3C/svg%3E"); }
input.ds-btn--ico-refresh { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234F566B' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 1 1-2.64-6.36L21 8'/%3E%3Cpath d='M21 3v5h-5'/%3E%3C/svg%3E"); }

/* ==========================================================================
   Seções de formulário com título lateral (cadastros longos)
   ========================================================================== */
.ds-fieldset {
    display: grid; grid-template-columns: minmax(180px, 240px) minmax(0, 1fr); gap: var(--ds-space-6);
    padding: var(--ds-space-6) 0;
    border-top: 1px solid var(--ds-border);
}
.ds-fieldset:first-child { border-top: 0; padding-top: 0; }
.ds-fieldset__title { font-size: var(--ds-fs-14); font-weight: var(--ds-fw-semibold); color: var(--ds-text); margin: 0; }
.ds-fieldset__desc { margin: var(--ds-space-1) 0 0; font-size: var(--ds-fs-13); color: var(--ds-text-secondary); }
.ds-fieldset .ds-form-grid { align-content: start; }
.ds-field--sm { max-width: 200px; }
@media (max-width: 991.98px) { .ds-fieldset { grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-3); } }

/* Matriz de checkboxes (ex.: emissão de documentos por perfil) */
table.ds-checkgrid td, table.ds-checkgrid th { text-align: center; }
table.ds-checkgrid td:first-child, table.ds-checkgrid th:first-child { text-align: left; }
table.ds-checkgrid label { display: none; } /* asp:CheckBox Text=" " gera um label vazio */

/* Variações de formulário */
.ds-form-grid--dense { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.ds-input--num { text-align: right; font-variant-numeric: tabular-nums; }
.ds-field--check .ds-check { height: var(--ds-control-height); }
.ds-searchpanel--flush { margin-bottom: 0; }

/* Coluna principal de listas (nome do registro) */
table.ds-table td.ds-col-strong { font-weight: var(--ds-fw-medium); }

/* ==========================================================================
   Rodapé de inclusão em grades (GridView ShowFooter="True" + FooterTemplate)
   DsHelper.PrepararGrid coloca o FooterRow em <tfoot>.
   ========================================================================== */
table.ds-table > tfoot > tr > td {
    padding: var(--ds-space-3);
    border: 0 !important;
    border-top: 1px solid var(--ds-border) !important;
    background: var(--ds-bg-subtle);
    vertical-align: top;
}
table.ds-table > tfoot > tr:first-child > td:first-child { border-bottom-left-radius: var(--ds-radius-lg); }
table.ds-table > tfoot > tr:first-child > td:last-child { border-bottom-right-radius: var(--ds-radius-lg); }
table.ds-table > tfoot .ds-input, table.ds-table > tfoot .ds-select { background-color: var(--ds-input-bg); }
table.ds-table > tfoot > tr.ds-pager > td { background: transparent; border-top: 0 !important; }
table.ds-table .ds-input--inline { width: auto; min-width: 80px; max-width: 100%; }

/* Grade de registro em "cartão" (ItemTemplate com vários campos, ex.: contatos) */
.ds-record { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 2px var(--ds-space-6); padding: var(--ds-space-1) 0; }
.ds-record__row { display: flex; gap: var(--ds-space-2); min-width: 0; font-size: var(--ds-fs-13); line-height: 22px; }
.ds-record__label { flex: 0 0 auto; min-width: 104px; color: var(--ds-text-secondary); }
.ds-record__value { min-width: 0; overflow-wrap: anywhere; color: var(--ds-text); }
.ds-record__title { grid-column: 1 / -1; font-size: var(--ds-fs-14); font-weight: var(--ds-fw-semibold); margin-bottom: 2px; }

/* ==========================================================================
   Layout com coluna lateral (formulário + painel de apoio)
   ========================================================================== */
.ds-split { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: var(--ds-space-4); align-items: start; }
.ds-split__aside { position: sticky; top: calc(var(--ds-topbar-height) + var(--ds-space-4)); }
/* Com coluna lateral não sobra largura para título à esquerda: título acima dos campos */
.ds-split .ds-fieldset { grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-3); }
.ds-split .ds-form-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
@media (max-width: 1199.98px) { .ds-split { grid-template-columns: minmax(0, 1fr); } .ds-split__aside { position: static; } }

/* Campo cujo controle o servidor pode ocultar (Visible=false): some por inteiro */
.ds-field--auto:not(:has(input, select, textarea)) { display: none; }

/* Lista de opções (checkboxes com texto) */
.ds-checklist { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--ds-space-2) var(--ds-space-6); }
.ds-checklist .ds-check { align-items: flex-start; line-height: 20px; }
.ds-checklist .ds-check input { margin-top: 2px; }

/* Linha de ação dentro de um campo (ex.: data + botão "Renovar") */
.ds-input-row > .ds-btn { flex: 0 0 auto; }
.ds-input-row > .ds-input--dv { flex: 0 0 64px; } /* dígito verificador ao lado do número (agência/conta) */

/* Nota de rodapé de formulário */
.ds-form-note { display: flex; align-items: center; gap: var(--ds-space-2); margin-top: var(--ds-space-4); color: var(--ds-text-secondary); font-size: var(--ds-fs-13); }

/* ==========================================================================
   ModalPopupExtender (AjaxControlToolkit): BackgroundCssClass="ds-modal-backdrop"
   e o Panel com CssClass="ds-modal__dialog ds-modal__dialog--act"
   ========================================================================== */
.ds-modal-backdrop { background: var(--ds-overlay); }
.ds-modal__dialog--act { width: min(520px, calc(100vw - 32px)); max-height: none; }

/* asp:ImageButton com visual de botão-ícone (quando o code-behind exige ImageButton):
   ImageUrl="~/Content/icons/btn-*.svg" CssClass="ds-btn ds-btn--secondary|ghost ds-btn--imgicon [ds-btn--sm]" */
input[type="image"].ds-btn--imgicon {
    width: var(--ds-control-height); height: var(--ds-control-height);
    padding: 7px; object-fit: contain; box-sizing: border-box;
}
input[type="image"].ds-btn--imgicon.ds-btn--sm { width: var(--ds-control-height-sm); height: var(--ds-control-height-sm); padding: 6px; }

/* Campo de arquivo (asp:FileUpload CssClass="ds-input ds-input--file") */
.ds-input--file { height: auto; min-height: var(--ds-control-height); padding: 3px 4px; font-size: var(--ds-fs-13); }
.ds-input--file::file-selector-button {
    margin-right: var(--ds-space-2); padding: 3px 10px;
    border: 1px solid var(--ds-border); border-radius: var(--ds-radius-sm);
    background: var(--ds-bg-subtle); color: var(--ds-text); font: inherit; cursor: pointer;
}

/* Janela de upload (popup pequena) */
.ds-upload { display: flex; flex-direction: column; gap: var(--ds-space-2); padding: var(--ds-space-4); }
.ds-upload__status { font-size: var(--ds-fs-12); color: var(--ds-text-secondary); }

/* Utilitários */
.ds-text-upper { text-transform: uppercase; }

/* Barras de ação geridas pelo servidor (padrão legado Inserir/Gravar/Cancelar):
   ações desabilitadas não fazem sentido no estado atual, então ficam ocultas */
.ds-page-actions [disabled], .ds-page-actions .aspNetDisabled,
.ds-popup__actions [disabled], .ds-popup__actions .aspNetDisabled { display: none !important; }
/* Botão Fechar (ID legado "btnFechar"): sempre o ÚLTIMO das ações, separado das demais por um divisor —
   mesmo padrão em páginas e popups, sem depender da ordem no markup. O divisor é o ::before do contêiner
   (pseudo-elemento vira item flex) e só aparece quando há outro botão visível além do Fechar. */
.ds-page-actions > [id$="_btnFechar"], .ds-popup__actions > [id$="_btnFechar"] { order: 2; }
.ds-page-actions:has(> [id$="_btnFechar"]:not([disabled]):not(.aspNetDisabled)):has(> :not([id$="_btnFechar"]):not([disabled]):not(.aspNetDisabled):not([type="hidden"]))::before,
.ds-popup__actions:has(> [id$="_btnFechar"]:not([disabled]):not(.aspNetDisabled)):has(> :not([id$="_btnFechar"]):not([disabled]):not(.aspNetDisabled):not([type="hidden"]))::before {
    content: ""; order: 1; align-self: center; width: 1px; height: 20px; margin: 0 var(--ds-space-1); background: var(--ds-border);
}

/* Redução de movimento */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 1ms !important; transition-duration: 1ms !important; }
}

/* ==========================================================================
   Linha de grade em alerta (o legado pintava a linha com ForeColor=Red; o
   .layout.cs troca a cor inline por esta classe) + amostra de cor para legendas
   ========================================================================== */
table.ds-table tr.ds-row--alert > td { color: var(--ds-danger); }
table.ds-table tr.ds-row--alert > td:first-child { box-shadow: inset 3px 0 0 var(--ds-danger); }
.ds-swatch { display: inline-block; width: 12px; height: 12px; border-radius: 3px; flex: 0 0 auto; background: var(--ds-border-strong); }
.ds-swatch--danger { background: var(--ds-danger); }
.ds-modal__dialog--act.ds-modal__dialog--lg { width: min(760px, calc(100vw - 32px)); }
.ds-modal__dialog--act .ds-modal__body { max-height: calc(100vh - 200px); }

/* Totais em linha (rótulo pequeno + valor) */
.ds-totals { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: var(--ds-space-4) var(--ds-space-6); }
.ds-totals__item { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ds-totals__label { font-size: var(--ds-fs-12); color: var(--ds-text-secondary); }
.ds-totals__value { font-size: var(--ds-fs-16); font-weight: var(--ds-fw-semibold); font-variant-numeric: tabular-nums; }
.ds-totals__item--strong .ds-totals__value { color: var(--ds-primary); }

/* Lista de definições (rótulo: valor) em modais de detalhe */
.ds-dl { display: grid; grid-template-columns: minmax(140px, max-content) 1fr; gap: var(--ds-space-2) var(--ds-space-4); margin: 0; font-size: var(--ds-fs-14); }
.ds-dl dt { color: var(--ds-text-secondary); }
.ds-dl dd { margin: 0; font-weight: var(--ds-fw-medium); font-variant-numeric: tabular-nums; min-width: 0; }
.ds-select--auto { width: auto; max-width: 100%; }

/* Duas colunas iguais (ex.: baixa em lote: parcelas encontradas | selecionadas) */
.ds-split--even { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 991.98px) { .ds-split--even { grid-template-columns: minmax(0, 1fr); } }
.ds-input--strong { font-weight: var(--ds-fw-semibold); color: var(--ds-text); }

/* ==========================================================================
   AjaxControlToolkit TabContainer com CssClass="ds-ajax-tabs" (substitui o tema ajax__tab_xp)
   ========================================================================== */
.ds-ajax-tabs .ajax__tab_header { display: flex; flex-wrap: wrap; gap: var(--ds-space-1); border-bottom: 1px solid var(--ds-border); }
.ds-ajax-tabs .ajax__tab_outer, .ds-ajax-tabs .ajax__tab_inner { display: inline-block; background: none; }
.ds-ajax-tabs .ajax__tab_tab {
    display: inline-block; padding: 8px 12px; margin-bottom: -1px; cursor: pointer;
    font-size: var(--ds-fs-14); color: var(--ds-text-secondary);
    border-bottom: 2px solid transparent; text-decoration: none;
}
.ds-ajax-tabs .ajax__tab_hover .ajax__tab_tab { color: var(--ds-text); }
.ds-ajax-tabs .ajax__tab_active .ajax__tab_tab { color: var(--ds-primary); border-bottom-color: var(--ds-primary); font-weight: var(--ds-fw-medium); }
.ds-ajax-tabs .ajax__tab_body { padding: var(--ds-space-4) 0 0; }

/* asp:DetailsView em modo de edição com CssClass="ds-dv" (rótulo à esquerda, campo à direita) */
table.ds-dv { border-collapse: separate; border-spacing: 0 var(--ds-space-2); width: 100%; }
table.ds-dv td { padding: 0; vertical-align: middle; border: 0; }
table.ds-dv td:first-child { width: 160px; padding-right: var(--ds-space-3); font-size: var(--ds-fs-13); font-weight: var(--ds-fw-medium); color: var(--ds-text); white-space: nowrap; }

.ds-col-danger { color: var(--ds-danger); font-weight: var(--ds-fw-semibold); }

/* ==========================================================================
   Modo compacto para telas de registro densas (ex.: Contas a receber)
   - .ds-page--wide       → marcador: a página usa toda a largura (sem o limite de 1280px)
   - .ds-hform            → formulário com rótulo à esquerda, em colunas (pouca rolagem vertical)
   - .ds-table--dense     → grade com muitas colunas (fonte 12px, espaçamento mínimo)
   ========================================================================== */
.ds-content:has(.ds-page--wide) { max-width: none; }

.ds-card--tight { padding: var(--ds-space-4); }
.ds-section--tight { margin-bottom: var(--ds-space-5); }
.ds-section--tight > .ds-section__header { margin-bottom: var(--ds-space-2); }

.ds-hform { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ds-space-2) var(--ds-space-6); }
.ds-hform--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ds-hform + .ds-hform, .ds-hform + .ds-hfield { margin-top: var(--ds-space-2); }
.ds-hform__col { display: flex; flex-direction: column; gap: var(--ds-space-2); min-width: 0; }
.ds-hfield { display: grid; grid-template-columns: 136px minmax(0, 1fr); align-items: center; gap: var(--ds-space-1) var(--ds-space-3); min-width: 0; }
.ds-hfield > .ds-label { margin: 0; font-size: var(--ds-fs-13); color: var(--ds-text-secondary); font-weight: var(--ds-fw-medium); }
.ds-hfield--top { align-items: start; }
.ds-hfield--top > .ds-label { padding-top: 7px; }
.ds-hfield__control { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ds-hfield .ds-field-error { grid-column: 2; }
@media (max-width: 1199.98px) { .ds-hform { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767.98px) {
    .ds-hform, .ds-hform--2 { grid-template-columns: minmax(0, 1fr); }
    .ds-hfield { grid-template-columns: minmax(0, 1fr); }
    .ds-hfield .ds-field-error { grid-column: 1; }
}

table.ds-table--dense { font-size: var(--ds-fs-12); }
table.ds-table--dense > thead > tr > th { height: 30px; padding: 0 6px; font-size: 11px; white-space: normal; line-height: 1.2; }
table.ds-table--dense > tbody > tr > td,
table.ds-table--dense > tfoot > tr > td { height: 32px; padding: 3px 6px; font-size: var(--ds-fs-12); }
table.ds-table--dense .ds-input, table.ds-table--dense .ds-select { height: 28px; font-size: var(--ds-fs-12); padding-left: 6px; padding-right: 6px; }
table.ds-table--dense .ds-col-actions { padding-right: 4px; }
table.ds-table--dense input[type="image"].ds-btn--imgicon.ds-btn--sm,
table.ds-table--dense .ds-btn--icon.ds-btn--sm { width: 24px; height: 24px; padding: 4px; }
.ds-input-row > .ds-input--num-sm { flex: 0 0 76px; }
.ds-input--total { background: var(--ds-primary-soft); color: var(--ds-primary); }
table.ds-table--dense .ds-input--inline { width: 96px; min-width: 0; }
table.ds-table--dense .ds-check { font-size: var(--ds-fs-12); }
@media (min-width: 992px) { .ds-content:has(.ds-page--wide) { padding-left: var(--ds-space-5); padding-right: var(--ds-space-5); } }
table.ds-table--dense > thead > tr > th, table.ds-table--dense > tbody > tr > td, table.ds-table--dense > tfoot > tr > td { padding-left: 5px; padding-right: 5px; }
table.ds-table--dense .ds-input--inline { width: 84px; }
table.ds-table--dense .ds-col-actions input[type="image"] + input[type="image"] { margin-left: 0; }
.ds-hform__title { margin: var(--ds-space-4) 0 var(--ds-space-2); padding-top: var(--ds-space-3); border-top: 1px solid var(--ds-border); font-size: var(--ds-fs-13); font-weight: var(--ds-fw-semibold); color: var(--ds-text); }
.ds-hform__spaced { margin-top: var(--ds-space-3); }

/* Formulários curtos em modais: 3/4 colunas e espaçamento menor (menos linhas) */
.ds-form-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ds-form-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ds-form-grid--tight { gap: var(--ds-space-3) var(--ds-space-3); }
.ds-form-grid--tight .ds-field { gap: 4px; }
.ds-form-grid--tight .ds-label { font-size: var(--ds-fs-13); }
@media (max-width: 767.98px) {
    .ds-form-grid--3, .ds-form-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.ds-ajax-tabs.ds-ajax-tabs--tight .ajax__tab_body { padding-top: var(--ds-space-3); }
.ds-modal__body .ds-stack--tight { gap: var(--ds-space-3); }
.ds-stack--tight { gap: var(--ds-space-3); }

/* Etiquetas (badges) dentro das grades: um pouco menores que a fonte das células */
table.ds-table .ds-badge { height: 18px; font-size: 11px; }

/* Indicadores em 4 colunas, versão menor (modais de detalhe) */
.ds-totals--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--ds-space-3) var(--ds-space-4); }
@media (max-width: 767.98px) { .ds-totals--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ds-totals--sm .ds-totals__value { font-size: var(--ds-fs-14); }
.ds-hform__title--block { display: block; margin-top: var(--ds-space-1); }
.ds-input-row > .ds-input--dv-sm { flex: 0 0 48px; }
/* Linha "nenhum registro" mais baixa dentro de modais */
.ds-modal__body table.ds-table .ds-table__empty td { padding: var(--ds-space-3); }
.ds-field--span3c { grid-column: span 3; }
@media (max-width: 767.98px) { .ds-field--span3c { grid-column: 1 / -1; } }
.ds-hform__title--block { border-top: 0; padding-top: 0; }

/* ==========================================================================
   Agenda: coluna lateral à esquerda + asp:Calendar (CssClass="ds-calendar")
   O asp:Calendar gera cores inline (título prateado, links pretos): sobrescritas aqui.
   ========================================================================== */
.ds-split--aside-left { grid-template-columns: 280px minmax(0, 1fr); }
@media (max-width: 991.98px) { .ds-split--aside-left { grid-template-columns: minmax(0, 1fr); } }

table.ds-calendar { width: 100%; border: 0 !important; border-collapse: separate !important; border-spacing: 2px; font-size: var(--ds-fs-13); }
table.ds-calendar td, table.ds-calendar th { border: 0 !important; background: transparent !important; text-align: center; padding: 0; }
table.ds-calendar .ds-calendar__title, table.ds-calendar .ds-calendar__title td { background: transparent !important; font-weight: var(--ds-fw-semibold); color: var(--ds-text); padding: 0 0 var(--ds-space-2); }
table.ds-calendar .ds-calendar__title table { width: 100%; }
table.ds-calendar .ds-calendar__nav a { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: var(--ds-radius-sm); color: var(--ds-text-secondary) !important; text-decoration: none; }
table.ds-calendar .ds-calendar__nav a:hover { background: var(--ds-bg-subtle) !important; color: var(--ds-text) !important; }
table.ds-calendar .ds-calendar__dayname { font-size: 11px; font-weight: var(--ds-fw-medium); color: var(--ds-text-secondary); padding: var(--ds-space-1) 0; text-transform: uppercase; }
table.ds-calendar .ds-calendar__day a { display: flex; height: 32px; align-items: center; justify-content: center; border-radius: var(--ds-radius-sm); color: var(--ds-text) !important; text-decoration: none; }
table.ds-calendar .ds-calendar__day a:hover { background: var(--ds-bg-subtle) !important; }
table.ds-calendar .ds-calendar__other a { color: var(--ds-text-tertiary, #A3ACB9) !important; }
table.ds-calendar .ds-calendar__today a { box-shadow: inset 0 0 0 1px var(--ds-primary); color: var(--ds-primary) !important; font-weight: var(--ds-fw-semibold); }
table.ds-calendar .ds-calendar__selected a { background: var(--ds-primary) !important; color: var(--ds-on-primary) !important; font-weight: var(--ds-fw-semibold); }

/* Grupo de botões de visualização (Dia / Semana) */
.ds-segmented { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-lg); background: var(--ds-bg-subtle); }
.ds-segmented > input[type="image"].ds-btn--imgicon { border: 0; background: transparent; box-shadow: none; }
.ds-segmented > input[type="image"].ds-btn--imgicon:hover { background: var(--ds-bg); }
.ds-agenda { border: 1px solid var(--ds-border); border-radius: var(--ds-radius-lg); overflow: hidden; background: var(--ds-bg); }
.ds-filterbar--flush { margin-bottom: 0; }

/* Caixa com rolagem própria para grades longas (preserva o id usado por scripts legados) */
.ds-scrollbox { max-height: 300px; overflow-y: auto; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-lg); }
.ds-scrollbox > table.ds-table > thead > tr > th { position: sticky; top: 0; z-index: 1; }
/* Linha já escolhida (o legado pintava com ForeColor = Red) */
table.ds-table tr.ds-row--picked > td { color: var(--ds-primary); }
table.ds-table tr.ds-row--picked > td:first-child { box-shadow: inset 3px 0 0 var(--ds-primary); }
/* Lista de valores (rótulo à esquerda, valor à direita) para resumos laterais */
.ds-dl--totals { grid-template-columns: minmax(0, 1fr) auto; gap: var(--ds-space-2) var(--ds-space-3); }
.ds-dl--totals dd { text-align: right; }
.ds-dl--totals dt.ds-dl__strong, .ds-dl--totals dd.ds-dl__strong { color: var(--ds-primary); font-weight: var(--ds-fw-semibold); }
.ds-dl--totals dd .ds-input { width: 120px; text-align: right; }
.ds-stack > .ds-tabs { margin-bottom: 0; }

/* ==========================================================================
   Controle de pendências (frmPendencia) — tela densa, pouca rolagem vertical
   - .ds-pend          → coluna lateral (totais + dados do cliente) | coluna principal (parcelas + cobrança)
   - .ds-kv            → pares rótulo/valor em 2 colunas (totais da negociação)
   - .ds-table--fichas → o code-behind pinta a linha (BackColor inline) por ficha CPJ; aqui só suavizamos
   ========================================================================== */
.ds-pend { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: var(--ds-space-4); align-items: start; }
.ds-pend__aside, .ds-pend__main { min-width: 0; }
@media (max-width: 1199.98px) { .ds-pend { grid-template-columns: minmax(0, 1fr); } }

.ds-pend__head { display: flex; align-items: center; flex-wrap: wrap; gap: var(--ds-space-2); margin-bottom: var(--ds-space-2); }
.ds-pend__head .ds-section__title { margin-right: auto; display: inline-flex; align-items: center; gap: var(--ds-space-2); }
.ds-pend__head .ds-select { height: var(--ds-control-height-sm); font-size: var(--ds-fs-13); }
.ds-pend__subtitle { display: block; margin: var(--ds-space-3) 0 var(--ds-space-1); font-size: var(--ds-fs-12); font-weight: var(--ds-fw-semibold); color: var(--ds-text-secondary); text-transform: uppercase; letter-spacing: .02em; }
.ds-pend__vinc { display: flex; align-items: center; flex-wrap: wrap; gap: var(--ds-space-2); margin-top: var(--ds-space-2); padding: var(--ds-space-2) var(--ds-space-3); border-radius: var(--ds-radius-lg); background: var(--ds-danger-bg); font-size: var(--ds-fs-13); }
.ds-pend__vinc:has(.ds-pend__vinc-nome:empty) { display: none; }
.ds-pend__vinc-nome { font-weight: var(--ds-fw-semibold); color: var(--ds-text); }
.ds-pend__vinc-rotulo { font-size: var(--ds-fs-12); font-weight: var(--ds-fw-semibold); color: var(--ds-danger); text-transform: uppercase; }
.ds-pend__filters { display: flex; align-items: center; flex-wrap: wrap; gap: var(--ds-space-2) var(--ds-space-4); margin-top: var(--ds-space-3); }
.ds-pend__filters > .ds-label { margin: 0; }
.ds-pend__filters .ds-filterbar__end { gap: var(--ds-space-2); }
.ds-pend__note { display: block; margin-top: var(--ds-space-2); font-size: var(--ds-fs-13); color: var(--ds-text-secondary); }
.ds-pend__tabscroll { max-height: clamp(200px, 34vh, 380px); overflow-y: auto; }
/* Caixa (mesmo layout do Controle de pendências) */
.ds-caixa__dados { display: flex; flex-direction: column; gap: 2px; font-size: var(--ds-fs-13); color: var(--ds-text-secondary); }
.ds-caixa__dados > span:empty { display: none; }
.ds-caixa__dados > .ds-caixa__nome { color: var(--ds-text); font-weight: var(--ds-fw-semibold); }
.ds-caixa__recebimentos { max-height: clamp(120px, 20vh, 220px); }
.ds-caixa__forma { display: grid; grid-template-columns: minmax(150px, 200px) minmax(0, 1fr); gap: var(--ds-space-3); align-items: start; margin-top: var(--ds-space-3); }
@media (max-width: 991.98px) { .ds-caixa__forma { grid-template-columns: minmax(0, 1fr); } }
/* Campo que contém só um botão, alinhado à base dos campos vizinhos numa ds-form-grid */
.ds-field.ds-field--btn { justify-content: flex-end; align-items: flex-start; }
.ds-pend__actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: var(--ds-space-2); margin-top: var(--ds-space-3); }

.ds-kv { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--ds-space-4); }
.ds-kv__item { display: flex; align-items: center; justify-content: space-between; gap: var(--ds-space-2); min-height: 32px; padding: 4px 0; border-bottom: 1px solid var(--ds-border); min-width: 0; }
.ds-kv__label { flex: 0 0 auto; font-size: 11px; font-weight: var(--ds-fw-medium); color: var(--ds-text-secondary); text-transform: uppercase; letter-spacing: .02em; white-space: nowrap; }
.ds-kv__value { font-size: var(--ds-fs-13); font-weight: var(--ds-fw-semibold); font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.ds-kv__item .ds-input { flex: 0 1 76px; width: 76px; min-width: 0; height: 24px; padding: 0 6px; font-size: var(--ds-fs-13); font-weight: var(--ds-fw-semibold); text-align: right; }
.ds-kv__item--strong { margin-top: 6px; padding: 4px var(--ds-space-2); border-bottom: 0; border-radius: var(--ds-radius); background: var(--ds-primary-soft); }
.ds-kv__item--strong .ds-kv__label, .ds-kv__item--strong .ds-kv__value { color: var(--ds-primary); }

/* Grades rótulo/valor (dados do proprietário, locatário...) */
table.ds-table--kv > tbody > tr > td { height: 26px; padding-top: 2px; padding-bottom: 2px; }
table.ds-table--kv > tbody > tr > td:first-child { width: 1%; white-space: nowrap; color: var(--ds-text-secondary); }
table.ds-table--kv > tfoot > tr > td { height: auto; padding-top: var(--ds-space-1); border-bottom: 0 !important; text-align: right; }

/* Parcelas: suaviza as cores das fichas (BackColor inline gerado pelo code-behind) e linhas desabilitadas */
table.ds-table--fichas > tbody > tr[bgcolor] > td,
table.ds-table--fichas > tbody > tr[style*="background-color"] > td { background-image: linear-gradient(var(--ds-veil), var(--ds-veil)); }
table.ds-table--fichas > tbody > tr[disabled] > td { color: var(--ds-text-secondary); }
table.ds-table--fichas > tbody > tr.is-selected > td { background-image: none; }
.ds-scrollbox--parcelas { max-height: clamp(180px, 30vh, 340px); }
.ds-scrollbox--sm { max-height: 220px; }
.ds-scrollbox--md { max-height: min(50vh, 420px); }

.ds-label--required::after { content: " *"; color: var(--ds-danger); }
.ds-text-danger { color: var(--ds-danger); }
.ds-text-strong { font-weight: var(--ds-fw-semibold); }
.ds-form-grid--6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
@media (max-width: 1399.98px) { .ds-form-grid--6 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 767.98px) { .ds-form-grid--6 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ds-form-grid--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 1199.98px) { .ds-form-grid--5 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767.98px) { .ds-form-grid--5 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ds-form-grid__title { grid-column: 1 / -1; margin: var(--ds-space-1) 0 0; font-size: var(--ds-fs-12); font-weight: var(--ds-fw-semibold); color: var(--ds-text-secondary); text-transform: uppercase; letter-spacing: .02em; }

/* Modal extra-larga (prorrogação de vencimentos, documentos vinculados) */
.ds-modal__dialog--xl { max-width: 1040px; }
.ds-modal__dialog--act.ds-modal__dialog--xl { width: min(1040px, calc(100vw - 32px)); }
.ds-split--modal { display: grid; grid-template-columns: minmax(0, 460px) minmax(0, 1fr); gap: var(--ds-space-4); align-items: start; }
@media (max-width: 991.98px) { .ds-split--modal { grid-template-columns: minmax(0, 1fr); } }
img.ds-btn--imgicon { width: var(--ds-control-height); height: var(--ds-control-height); padding: 7px; object-fit: contain; box-sizing: border-box; cursor: pointer; }
.ds-modal__text { margin: 0 0 var(--ds-space-3); font-size: var(--ds-fs-14); color: var(--ds-text-secondary); }
/* Abas compactas (colunas estreitas): menos espaçamento, sem quebrar a linha das abas */
.ds-ajax-tabs.ds-ajax-tabs--tight .ajax__tab_header { gap: 0; }
.ds-ajax-tabs.ds-ajax-tabs--tight .ajax__tab_tab { padding: 6px 10px; font-size: var(--ds-fs-13); white-space: nowrap; }
.ds-pend__aside .ds-ajax-tabs .ajax__tab_header { flex-wrap: nowrap; overflow: hidden; }
/* Grade de 6 colunas: rótulos numa linha só e campos alinhados pela base */
.ds-form-grid--6 .ds-field { justify-content: flex-end; min-width: 0; }
.ds-form-grid--6 .ds-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ds-form-grid--6 .ds-select { padding-right: 24px; }
/* ds-col-danger em células de grade (vence a cor padrão de table.ds-table td) */
table.ds-table > tbody > tr > td.ds-col-danger { color: var(--ds-danger); font-weight: var(--ds-fw-semibold); }
.ds-pend__tabscroll table.ds-table .ds-table__empty td, .ds-scrollbox table.ds-table .ds-table__empty td { padding: var(--ds-space-3); }
.ds-pend__head .ds-select--auto { min-width: 220px; }
/* ds-kv: valores longos (ex.: "12 X 1.234,56") descem para a linha de baixo, alinhados à direita, em vez de vazar */
.ds-kv__item { flex-wrap: wrap; row-gap: 0; column-gap: var(--ds-space-2); }
.ds-kv__value { margin-left: auto; max-width: 100%; }
.ds-kv__item .ds-input { flex: 0 1 64px; width: 64px; margin-left: auto; }
/* Abas da coluna lateral (Proprietário/Locatário/Usuário/Procurador): dividem a largura, sem rolagem horizontal */
.ds-pend__aside .ds-ajax-tabs .ajax__tab_outer { flex: 1 1 auto; min-width: 0; }
.ds-pend__aside .ds-ajax-tabs .ajax__tab_inner { display: block; }
.ds-pend__aside .ds-ajax-tabs .ajax__tab_tab { display: block; padding: 6px 4px; font-size: var(--ds-fs-12); text-align: center; overflow: hidden; text-overflow: ellipsis; }
.ds-pend__aside table.ds-table--kv td { overflow-wrap: anywhere; }
/* Grades de leitura densa (histórico do cliente, dados do proprietário/locatário...): fonte 11px */
table.ds-table--xs > tbody > tr > td,
table.ds-table--xs > tfoot > tr > td { height: 28px; padding-top: 2px; padding-bottom: 2px; font-size: 11px; line-height: 1.3; }
table.ds-table--xs > thead > tr > th { height: 26px; font-size: 11px; }
table.ds-table--kv.ds-table--xs > tbody > tr > td { height: 28px; padding-top: 3px; padding-bottom: 3px; }
/* Prorrogar vencimento: a grade ocupa a maior parte da largura e cabe sem rolagem horizontal */
.ds-split--modal { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
.ds-split--modal > .ds-scrollbox { overflow-x: hidden; }
.ds-split--modal table.ds-table--xs > thead > tr > th,
.ds-split--modal table.ds-table--xs > tbody > tr > td { padding-left: 4px; padding-right: 4px; white-space: nowrap; }
.ds-split--modal table.ds-table--xs .ds-input--inline { width: 80px; height: 24px; font-size: 11px; }
@media (max-width: 991.98px) { .ds-split--modal { grid-template-columns: minmax(0, 1fr); } .ds-split--modal > .ds-scrollbox { overflow-x: auto; } }
/* Taxas administrativas: colunas de largura fixa (campos numéricos curtos) e controles mais baixos */
.ds-form-grid--6 { grid-template-columns: repeat(auto-fill, minmax(104px, 115px)); justify-content: start; gap: var(--ds-space-2) var(--ds-space-3); }
.ds-form-grid--6 .ds-field--span2c { grid-column: span 2; }
.ds-form-grid--6 .ds-input, .ds-form-grid--6 .ds-select { height: var(--ds-control-height-sm); font-size: var(--ds-fs-13); }
.ds-form-grid--6 .ds-label { font-size: var(--ds-fs-12); }
/* Prorrogar vencimento: painel lateral em blocos (parcela | parâmetros | resultado) */
.ds-venc { display: flex; flex-direction: column; gap: var(--ds-space-3); min-width: 0; }
.ds-venc__bloco { padding: var(--ds-space-3); border: 1px solid var(--ds-border); border-radius: var(--ds-radius-lg); }
.ds-venc__titulo { display: block; margin-bottom: var(--ds-space-2); font-size: 11px; font-weight: var(--ds-fw-semibold); color: var(--ds-text-secondary); text-transform: uppercase; letter-spacing: .03em; }
.ds-venc__params .ds-input, .ds-venc__params .ds-btn { height: var(--ds-control-height-sm); font-size: var(--ds-fs-13); }
.ds-venc__params .ds-label { font-size: var(--ds-fs-12); white-space: nowrap; }
/* TextBox somente leitura exibido como valor (sem caixa): o code-behind continua lendo/gravando .Text */
.ds-input.ds-input--plain, .ds-input.ds-input--plain[readonly] {
    height: auto; padding: 0; border: 0; background: transparent; box-shadow: none; color: var(--ds-text);
    font-size: var(--ds-fs-13); font-weight: var(--ds-fw-semibold); text-align: right; font-variant-numeric: tabular-nums; cursor: default;
}
.ds-input.ds-input--plain:focus { box-shadow: none; outline: 0; }
.ds-input.ds-input--plain:focus-visible { outline: 2px solid var(--ds-primary); outline-offset: 2px; border-radius: 2px; }
.ds-kv__item .ds-input.ds-input--plain { flex: 1 1 0; width: auto; min-width: 0; margin-left: auto; }
.ds-kv__item--strong .ds-input.ds-input--plain { color: var(--ds-primary); font-size: var(--ds-fs-14); }
table.ds-table td.ds-col-param { width: 340px; }
.ds-scrollbox--tall { max-height: calc(100vh - 360px); min-height: 240px; }
table.ds-table td.ds-col-perm { width: 84px; }
/* Colaboradores: formulário à esquerda, perfil/jornada/situações à direita */
/* Colaboradores: grades pequenas (jornada, situações de cobrança) dentro de uma seção ds-fieldset */
.ds-colab__grade { max-width: 640px; }
.ds-checklist--tight { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: var(--ds-space-2) var(--ds-space-4); margin-top: var(--ds-space-3); }
.ds-check > label { font-size: var(--ds-fs-13); }
.ds-tabs .ds-filterbar__end { align-self: center; padding-bottom: 4px; }
/* .ds-split--grids: dentro do split, respeita a quantidade de colunas pedida (a regra .ds-split .ds-form-grid usa auto-fill) */
.ds-split--grids .ds-form-grid.ds-form-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ds-split--grids .ds-form-grid.ds-form-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ds-split--grids .ds-form-grid.ds-form-grid--6 { grid-template-columns: repeat(auto-fill, minmax(104px, 115px)); }
@media (max-width: 767.98px) { .ds-split--grids .ds-form-grid.ds-form-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Rateio de despesas */
.ds-split--rateio { grid-template-columns: minmax(0, 1fr) minmax(0, 360px); }
@media (max-width: 1199.98px) { .ds-split--rateio { grid-template-columns: minmax(0, 1fr); } }
.ds-split--rateio .ds-form-grid.ds-form-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ds-rateio__titulo { margin-bottom: var(--ds-space-3); }
.ds-rateio__opcoes { flex-direction: row; align-items: center; flex-wrap: wrap; gap: var(--ds-space-2) var(--ds-space-4); align-self: end; min-height: var(--ds-control-height); }
.ds-rateio__opcoes--fim { justify-content: flex-end; }
.ds-rateio__grade { margin-top: var(--ds-space-4); }
/* RadioButtonList (RepeatLayout="Flow") com CssClass="ds-radiolist" */
/* O Flow gera input, label e br como irmãos soltos: grade de 2 colunas (círculo | texto), um item por linha */
.ds-radiolist { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--ds-space-2) 0; font-size: var(--ds-fs-14); }
.ds-radiolist > span { display: contents; } /* item desabilitado vem embrulhado em <span class="aspNetDisabled"> */.ds-radiolist input[type="radio"] { margin: 0 var(--ds-space-2) 0 0; accent-color: var(--ds-primary); }
.ds-radiolist label { cursor: pointer; }
.ds-radiolist br { display: none; }
.ds-radiolist input[disabled] + label { color: var(--ds-text-tertiary, #A3ACB9); }
/* Formulário compacto com rótulo à esquerda em 2 colunas (como o legado): .ds-lform > .ds-hfield */
.ds-lform { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ds-space-2) var(--ds-space-6); align-items: start; max-width: 1080px; }
.ds-lform > .ds-hfield { grid-template-columns: 136px minmax(0, 1fr); }
.ds-lform > .ds-hfield--span2 { grid-column: span 2; }
.ds-lform .ds-input--short { width: 140px; max-width: 100%; }
.ds-lform__inline { display: flex; align-items: center; flex-wrap: wrap; gap: var(--ds-space-2) var(--ds-space-4); min-width: 0; }
.ds-lform__inline > .ds-input--short { flex: 0 0 140px; }
.ds-lform__acoes { display: flex; justify-content: flex-end; align-items: center; gap: var(--ds-space-2); }
.ds-lform .ds-hfield > .ds-check { height: var(--ds-control-height); }
@media (max-width: 991.98px) { .ds-lform { grid-template-columns: minmax(0, 1fr); } .ds-lform > .ds-hfield--span2 { grid-column: auto; } }
/* Blocos de um formulário ds-lform (ex.: Cliente / Cobrança / Encargos): título com divisória; o primeiro não tem */
.ds-lform__titulo { margin: var(--ds-space-4) 0 var(--ds-space-2); padding-top: var(--ds-space-3); border-top: 1px solid var(--ds-border); font-size: 11px; font-weight: var(--ds-fw-semibold); color: var(--ds-text-secondary); text-transform: uppercase; letter-spacing: .03em; }
.ds-lform__titulo:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.ds-lform__titulo > label { font: inherit; color: inherit; margin: 0; }
.ds-lform__acoes--sep { margin-top: var(--ds-space-3); }
.ds-textarea.ds-textarea--sm { min-height: 56px; }
/* Campos numéricos curtos em 3 colunas (rótulo mais estreito) */
.ds-lform--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ds-space-2) var(--ds-space-4); }
.ds-lform--3 > .ds-hfield { grid-template-columns: 104px minmax(0, 1fr); }
@media (max-width: 991.98px) { .ds-lform--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .ds-lform--3 { grid-template-columns: minmax(0, 1fr); } }
/* Migração de pendências: formulário à esquerda, parcelas geradas (3 colunas) numa coluna estreita */
.ds-split--migracao { grid-template-columns: minmax(0, 1fr) minmax(0, 400px); }
@media (max-width: 1199.98px) { .ds-split--migracao { grid-template-columns: minmax(0, 1fr); } }
.ds-migracao__vazio { margin: var(--ds-space-3) 0 0; }
.ds-card:has(table.ds-table) > .ds-migracao__vazio { display: none; }
.ds-split--migracao .ds-scrollbox { max-height: max(320px, calc(100vh - 300px)); }
.ds-split--migracao .ds-scrollbox:not(:has(table)) { display: none; }
.ds-split--migracao table.ds-table td { white-space: nowrap; }
/* Filtro extra antes do construtor de pesquisa (ex.: "Exibir rateios"): estreito e alinhado à linha dos campos */
.ds-searchpanel > .ds-field.ds-searchpanel__extra { flex: 0 0 170px; align-self: flex-end; margin-bottom: var(--ds-space-3); } /* a .ds-query reserva um gap abaixo da linha de campos */
.ds-split--rateio { grid-template-columns: minmax(0, 1fr) minmax(0, 420px); }
/* Telas de importação: campos/cartões estreitos e rádio em linha dentro de grades */
.ds-field--narrow { max-width: 320px; }
.ds-card--narrow { max-width: 640px; }
.ds-radiolist--inline { display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--ds-space-1) var(--ds-space-3); font-size: var(--ds-fs-12); }

/* ==========================================================================
   Temas — seletor "Aparência" (menu do usuário) e ajustes de componentes
   que não usam tokens (ícones SVG em <input type="image"> e a agenda DayPilot)
   ========================================================================== */
.ds-theme-picker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ds-space-1); padding: 0 var(--ds-space-1) var(--ds-space-2); list-style: none; }
.ds-theme-picker__opt {
    display: flex; align-items: center; gap: var(--ds-space-2); width: 100%;
    padding: 6px var(--ds-space-2); border: 1px solid var(--ds-border); border-radius: var(--ds-radius);
    background: var(--ds-bg); color: var(--ds-text); font: inherit; font-size: var(--ds-fs-13); text-align: left; cursor: pointer;
}
.ds-theme-picker__opt:hover { background: var(--ds-bg-subtle); }
.ds-theme-picker__opt:focus-visible { outline: none; box-shadow: var(--ds-focus-ring); }
.ds-theme-picker__opt[aria-checked="true"] { border-color: var(--ds-primary); box-shadow: inset 0 0 0 1px var(--ds-primary); font-weight: var(--ds-fw-medium); }
.ds-theme-picker__swatch { flex: 0 0 auto; width: 16px; height: 16px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .18); }
.ds-theme-picker__swatch--claro { background: linear-gradient(135deg, #FAFBFC 50%, #635BFF 50%); }
.ds-theme-picker__swatch--cinza { background: linear-gradient(135deg, #EEEFF1 50%, #5A52E0 50%); }
.ds-theme-picker__swatch--escuro { background: linear-gradient(135deg, #1C1F24 50%, #8B85FF 50%); }
.ds-theme-picker__swatch--noite { background: linear-gradient(135deg, #121A2B 50%, #8C88FF 50%); }

/* Temas escuros: os ícones dos ImageButton (btn-*.svg, traço cinza-escuro fixo) ficam claros por filtro;
   o botão perde fundo/borda porque o filtro também inverteria essas cores. */
html[data-theme="escuro"] .ds-btn--imgicon, html[data-theme="noite"] .ds-btn--imgicon {
    background: transparent !important; border-color: transparent !important; box-shadow: none !important;
    filter: invert(1) hue-rotate(180deg) brightness(1.05);
}
html[data-theme="escuro"] .ds-btn--imgicon:hover, html[data-theme="noite"] .ds-btn--imgicon:hover { filter: invert(1) hue-rotate(180deg) brightness(1.35); }
/* Agenda (DayPilot 3.1 só aceita cores fixas por propriedade): escurecida por filtro, preservando o matiz dos eventos */
html[data-theme="escuro"] .ds-agenda, html[data-theme="noite"] .ds-agenda { filter: invert(.9) hue-rotate(180deg); }
/* ==========================================================================
   Relatórios por grupo — .ds-rel (página Relatorios/frmRelatorios.aspx)
   Um box (ds-card) por relatório permitido; o clique abre o formulário no .ds-drawer.
   ========================================================================== */
.ds-rel [hidden] { display: none !important; }
.ds-rel__barra { display: flex; align-items: center; justify-content: space-between; gap: var(--ds-space-3); flex-wrap: wrap; margin-bottom: var(--ds-space-5); }
.ds-rel__total { margin: 0; color: var(--ds-text-secondary); font-size: var(--ds-fs-13); }
.ds-rel__filtro { flex: 0 1 300px; min-width: 200px; }
.ds-rel__secao + .ds-rel__secao { margin-top: var(--ds-space-6); }
.ds-rel__titulo {
    margin: 0 0 var(--ds-space-3);
    font-size: var(--ds-fs-12); font-weight: var(--ds-fw-semibold); color: var(--ds-text-secondary);
    text-transform: uppercase; letter-spacing: .04em;
}
.ds-rel__card { flex-direction: row; align-items: center; gap: var(--ds-space-3); min-height: 72px; padding: var(--ds-space-4); text-decoration: none !important; }
.ds-rel__card .ds-card__icon { flex: 0 0 auto; }
.ds-rel__nome {
    flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px;
    font-size: var(--ds-fs-14); font-weight: var(--ds-fw-medium); color: var(--ds-text); line-height: 1.3;
}
.ds-rel__dica { font-size: var(--ds-fs-12); font-weight: var(--ds-fw-regular); color: var(--ds-text-secondary); }
.ds-rel__seta { flex: 0 0 auto; color: var(--ds-text-tertiary); transition: transform var(--ds-transition), color var(--ds-transition); }
.ds-rel__card:hover .ds-rel__seta, .ds-rel__card:focus-visible .ds-rel__seta { color: var(--ds-primary); transform: translateX(2px); }
.ds-rel__card.is-open { box-shadow: 0 0 0 2px var(--ds-primary); }
.ds-rel__card.is-disabled { cursor: not-allowed; opacity: .7; }
.ds-rel__card.is-disabled .ds-card__icon { background: var(--ds-bg-muted); color: var(--ds-text-tertiary); }
.ds-rel__vazio { margin: 0; padding: var(--ds-space-8) 0; text-align: center; color: var(--ds-text-secondary); }

/* links ocultos do menu: um por relatório, só para a busca do topo (ver MenuRenderer.RenderGrupoIndice) */
.ds-nav__busca { display: none !important; }

/* ==========================================================================
   Painel lateral — .ds-drawer (criado pelo ds.js; o conteúdo é a página do relatório num iframe)
   ========================================================================== */
.ds-drawer {
    position: fixed; inset: 0; z-index: var(--ds-z-modal);
    display: flex; justify-content: flex-end;
    background: var(--ds-overlay);
    animation: ds-drawer-fundo 160ms ease-out;
}
.ds-drawer[hidden] { display: none; }
.ds-drawer__panel {
    position: relative; display: flex; flex-direction: column;
    width: 600px; max-width: 92vw; height: 100%;
    background: var(--ds-bg); box-shadow: var(--ds-shadow-modal);
    animation: ds-drawer-entra 200ms ease-out;
}
.ds-drawer__frame { flex: 1 1 auto; width: 100%; border: 0; background: var(--ds-bg); }
.ds-drawer__loading {
    position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: var(--ds-space-2);
    color: var(--ds-text-secondary); font-size: var(--ds-fs-13); pointer-events: none;
}
.ds-drawer.is-loaded .ds-drawer__loading { display: none; }
.ds-drawer:not(.is-loaded) .ds-drawer__frame { visibility: hidden; }
@keyframes ds-drawer-fundo { from { opacity: 0; } }
@keyframes ds-drawer-entra { from { transform: translateX(32px); opacity: .4; } }
@media (max-width: 767px) { .ds-drawer__panel { width: 100% !important; max-width: 100%; } }
@media (prefers-reduced-motion: reduce) { .ds-drawer, .ds-drawer__panel { animation: none; } }

/* página de relatório aberta dentro do painel (PopUp.Master marca <html class="ds-embed">) */
html.ds-embed, html.ds-embed body { background: var(--ds-bg); }

/* Plano de contas (ds.js → indentarOpcoes): contas sintéticas em destaque; as analíticas vêm recuadas */
select option.ds-opt-grupo { font-weight: var(--ds-fw-semibold); }

/* ==========================================================================
   Zoom da interface — .ds-zoom (barra superior; ds.js → aplicarZoom)
   A preferência fica em localStorage['ds.zoom'] e é aplicada como zoom no <html> pelo script do <head> dos masters.
   ========================================================================== */
.ds-zoom__toggle {
    display: inline-flex; align-items: center; justify-content: center;
    height: 28px; min-width: 44px; padding: 0 var(--ds-space-2);
    border: 1px solid transparent; border-radius: var(--ds-radius);
    background: transparent; color: var(--ds-text-secondary);
    font-family: var(--ds-font); font-size: var(--ds-fs-12); font-weight: var(--ds-fw-semibold); font-variant-numeric: tabular-nums;
    cursor: pointer; transition: background var(--ds-transition), color var(--ds-transition), border-color var(--ds-transition);
}
.ds-zoom__toggle:hover, .ds-zoom__toggle[aria-expanded="true"] { background: var(--ds-bg-subtle); color: var(--ds-text); border-color: var(--ds-border); }
.ds-zoom__toggle:focus-visible { outline: none; box-shadow: var(--ds-focus-ring); }
.ds-zoom__menu { min-width: 168px; }
.ds-zoom__menu [aria-checked="true"] { color: var(--ds-primary) !important; font-weight: var(--ds-fw-semibold); }
.ds-zoom__menu [aria-checked="true"]::after { content: "✓"; margin-left: auto; padding-left: var(--ds-space-3); }
.ds-zoom__padrao { margin-left: var(--ds-space-1); color: var(--ds-text-tertiary); font-size: var(--ds-fs-12); font-weight: var(--ds-fw-regular); }

/* ==========================================================================
   Mensagens e confirmações — .ds-dialogo (caixa central) e .ds-toast (aviso de sucesso)
   Montados pelo Scripts/ds-dialogos.js no lugar de window.alert / window.confirm.
   ========================================================================== */
.ds-dialogo {
    position: fixed; inset: 0; z-index: 100000;   /* acima dos modais do AjaxControlToolkit (10000/10001), do painel e do "Aguarde" */
    display: flex; align-items: flex-start; justify-content: center;
    padding: 14vh var(--ds-space-4) var(--ds-space-4);
    background: var(--ds-overlay);
    animation: ds-dialogo-fundo 140ms ease-out;
}
.ds-dialogo__caixa {
    display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--ds-space-4); row-gap: var(--ds-space-5);
    width: min(440px, 100%);
    padding: var(--ds-space-5) var(--ds-space-6) var(--ds-space-5) var(--ds-space-5);
    background: var(--ds-bg); border-radius: var(--ds-radius-xl); box-shadow: var(--ds-shadow-modal);
    animation: ds-pop 160ms ease-out;
}
.ds-dialogo__icone {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: 50%;
    background: var(--ds-info-bg); color: var(--ds-info);
}
.ds-dialogo--erro .ds-dialogo__icone, .ds-dialogo--perigo .ds-dialogo__icone { background: var(--ds-danger-bg); color: var(--ds-danger); }
.ds-dialogo--aviso .ds-dialogo__icone { background: var(--ds-warning-bg); color: var(--ds-warning); }
.ds-dialogo--sucesso .ds-dialogo__icone { background: var(--ds-success-bg); color: var(--ds-success); }
.ds-dialogo--pergunta .ds-dialogo__icone { background: var(--ds-primary-soft); color: var(--ds-primary); }
.ds-dialogo__conteudo { min-width: 0; padding-top: 2px; }
.ds-dialogo__titulo { margin: 0 0 var(--ds-space-1); font-size: var(--ds-fs-16); font-weight: var(--ds-fw-semibold); color: var(--ds-text); line-height: var(--ds-lh-tight); }
.ds-dialogo__texto { margin: 0; font-size: var(--ds-fs-14); color: var(--ds-text-secondary); line-height: var(--ds-lh-base); white-space: pre-line; overflow-wrap: anywhere; }
.ds-dialogo__acoes { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: var(--ds-space-2); }
.ds-dialogo__acoes .ds-btn { min-width: 96px; }
@keyframes ds-dialogo-fundo { from { opacity: 0; } }

.ds-toasts {
    position: fixed; top: calc(var(--ds-topbar-height) + var(--ds-space-3)); right: var(--ds-space-4);
    z-index: 100000;
    display: flex; flex-direction: column; gap: var(--ds-space-2); width: min(380px, calc(100vw - 32px));
    pointer-events: none;
}
.ds-toast {
    display: flex; align-items: flex-start; gap: var(--ds-space-3);
    padding: var(--ds-space-3) var(--ds-space-3) var(--ds-space-3) var(--ds-space-4);
    background: var(--ds-bg); border: 1px solid var(--ds-border); border-left: 3px solid var(--ds-success);
    border-radius: var(--ds-radius-lg); box-shadow: var(--ds-shadow-dropdown);
    font-size: var(--ds-fs-14); color: var(--ds-text); pointer-events: auto;
    animation: ds-toast-entra 200ms ease-out;
}
.ds-toast__icone { display: inline-flex; color: var(--ds-success); margin-top: 1px; }
.ds-toast__texto { flex: 1 1 auto; min-width: 0; line-height: var(--ds-lh-base); overflow-wrap: anywhere; }
.ds-toast__fechar {
    display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
    width: 24px; height: 24px; padding: 0; border: 0; border-radius: var(--ds-radius);
    background: transparent; color: var(--ds-text-tertiary); cursor: pointer;
}
.ds-toast__fechar:hover { background: var(--ds-bg-subtle); color: var(--ds-text); }
.ds-toast__fechar .ds-icon { width: 14px; height: 14px; }
.ds-toast.is-saindo { opacity: 0; transform: translateX(12px); transition: opacity 180ms ease, transform 180ms ease; }
@keyframes ds-toast-entra { from { opacity: 0; transform: translateX(16px); } }
@media (prefers-reduced-motion: reduce) { .ds-dialogo, .ds-dialogo__caixa, .ds-toast { animation: none; } }
/* caixa aberta: a página ao fundo não rola (classe própria, independente do ds-no-scroll do painel) */
body.ds-dialogo-aberto { overflow: hidden; }