/* Componentes compartilhados: um jeito só de fazer cartão, botão, campo, tabela, selo,
 * aba, menu, modal, aviso, paginação e estado vazio. As páginas só posicionam. */

/* ---------- Cartões e painéis ---------- */

.card,
.y-panel {
    --bs-card-bg: var(--y-surface);
    --bs-card-color: var(--y-text);
    --bs-card-border-color: var(--y-border-soft);
    --bs-card-cap-bg: transparent;
    --bs-card-border-radius: var(--y-r-lg);
    --bs-card-inner-border-radius: calc(var(--y-r-lg) - 1px);
    border-radius: var(--y-r-lg);
    box-shadow: var(--y-shadow-card);
}

.y-panel {
    border: 1px solid var(--y-border-soft);
    background: var(--y-surface);
    overflow: hidden;
}

.y-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    min-height: 52px;
    padding: .75rem 1.1rem;
    border-bottom: 1px solid var(--y-border-soft);
    font-size: var(--y-fs-md);
    font-weight: 650;
    color: var(--y-text);
}

.y-panel-head > a,
.y-panel-head .y-panel-link {
    flex-shrink: 0;
    font-size: var(--y-fs-sm);
    font-weight: 500;
    color: var(--y-text-2);
}

.y-panel-head > a:hover,
.y-panel-head .y-panel-link:hover { color: var(--y-text); }

.y-panel-head > a::after,
.y-panel-head .y-panel-link::after {
    content: "\F285";
    margin-left: .3rem;
    font-family: "bootstrap-icons";
    font-size: .65rem;
}

.y-panel .table { margin: 0; }
.y-panel .table > :not(caption) > * > *:first-child { padding-left: 1.1rem; }
.y-panel .table > :not(caption) > * > *:last-child { padding-right: 1.1rem; }

a.card,
a.y-panel {
    color: inherit;
    transition: border-color var(--y-fast) ease, background-color var(--y-fast) ease;
}

a.card:hover,
a.y-panel:hover {
    border-color: var(--y-border);
    background-color: color-mix(in srgb, var(--y-surface) 94%, var(--y-text));
    color: inherit;
}

.card-title { font-weight: 650; }

.y-section-title {
    display: flex;
    align-items: center;
    gap: .75rem;
    line-height: 1.3;
}

.y-section-title small {
    display: block;
    margin-top: .15rem;
    font-size: var(--y-fs-sm);
    font-weight: 400;
    color: var(--y-text-2);
}

.y-section-icon {
    display: grid;
    flex-shrink: 0;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--y-border-soft);
    border-radius: var(--y-r-md);
    background: var(--y-sunken);
    color: var(--y-text-2);
    font-size: 1rem;
    font-weight: 650;
}

/* Números de destaque (cartão de indicador) */
.y-stat .card-body { padding: .9rem 1rem; }

.y-stat-label {
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: var(--y-fs-sm);
    font-weight: 500;
    color: var(--y-text-2);
}

.y-stat-value {
    margin: .25rem 0 0;
    font-size: var(--y-fs-num);
    font-weight: 650;
    line-height: 1.1;
    letter-spacing: -.01em;
    color: var(--y-text);
}

.y-stat small { font-size: var(--y-fs-sm); }

/* ---------- Botões ----------
 * Primário: dourado com texto escuro (uma ação principal por área).
 * Secundário: neutro com borda. Discreto: só texto. Destrutivo: vermelho. */

.btn {
    --bs-btn-font-size: var(--y-fs-md);
    --bs-btn-font-weight: 600;
    --bs-btn-padding-x: .95rem;
    --bs-btn-padding-y: .4rem;
    --bs-btn-border-radius: var(--y-r-md);
    --bs-btn-focus-box-shadow: var(--y-focus);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .15rem;
    min-height: var(--y-ctl-h);
    line-height: 1.3;
    transition: background-color var(--y-fast) ease, border-color var(--y-fast) ease, color var(--y-fast) ease, box-shadow var(--y-fast) ease;
}

.btn-sm {
    --bs-btn-font-size: var(--y-fs-sm);
    --bs-btn-padding-x: .65rem;
    --bs-btn-padding-y: .25rem;
    min-height: var(--y-ctl-h-sm);
}

.btn-lg { min-height: 2.75rem; }

.btn:focus-visible { box-shadow: var(--y-focus); }

.btn-primary {
    --bs-btn-color: var(--y-on-gold);
    --bs-btn-bg: var(--y-gold);
    --bs-btn-border-color: var(--y-gold);
    --bs-btn-hover-color: var(--y-on-gold);
    --bs-btn-hover-bg: var(--y-gold-hover);
    --bs-btn-hover-border-color: var(--y-gold-hover);
    --bs-btn-active-color: var(--y-on-gold);
    --bs-btn-active-bg: var(--y-gold-press);
    --bs-btn-active-border-color: var(--y-gold-press);
    --bs-btn-disabled-color: var(--y-on-gold);
    --bs-btn-disabled-bg: var(--y-gold);
    --bs-btn-disabled-border-color: var(--y-gold);
    --bs-btn-disabled-opacity: .45;
}

.btn-secondary,
.btn-outline-secondary,
.btn-outline-primary,
.btn-light,
.y-btn-gold-outline {
    --bs-btn-color: var(--y-text);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--y-border);
    --bs-btn-hover-color: var(--y-text);
    --bs-btn-hover-bg: var(--y-hover);
    --bs-btn-hover-border-color: var(--y-text-3);
    --bs-btn-active-color: var(--y-text);
    --bs-btn-active-bg: var(--y-press);
    --bs-btn-active-border-color: var(--y-text-3);
    --bs-btn-disabled-color: var(--y-text-3);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--y-border-soft);
    --bs-btn-disabled-opacity: .7;
}

/* Grupo de opções (filtros por status, dias da semana): marcado = selecionado em dourado. */
.btn-check:checked + .btn-outline-secondary,
.btn-outline-secondary.active,
.btn-check:checked + .y-btn-gold-outline {
    border-color: var(--y-gold-line);
    background: var(--y-gold-soft);
    color: var(--y-text);
}

.btn-check:focus-visible + .btn { box-shadow: var(--y-focus); }

.btn-link {
    --bs-btn-color: var(--y-text-2);
    --bs-btn-hover-color: var(--y-text);
    --bs-btn-active-color: var(--y-text);
    --bs-btn-font-weight: 500;
    text-decoration: none;
}

.btn-danger {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--y-bad-solid);
    --bs-btn-border-color: var(--y-bad-solid);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: color-mix(in srgb, var(--y-bad-solid) 88%, #000);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--y-bad-solid) 88%, #000);
    --bs-btn-active-bg: color-mix(in srgb, var(--y-bad-solid) 80%, #000);
    --bs-btn-disabled-bg: var(--y-bad-solid);
    --bs-btn-disabled-border-color: var(--y-bad-solid);
    --bs-btn-disabled-opacity: .45;
}

.btn-outline-danger {
    --bs-btn-color: var(--y-bad);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--y-bad-line);
    --bs-btn-hover-color: var(--y-bad);
    --bs-btn-hover-bg: var(--y-bad-bg);
    --bs-btn-hover-border-color: var(--y-bad);
    --bs-btn-active-color: var(--y-bad);
    --bs-btn-active-bg: var(--y-bad-bg);
    --bs-btn-active-border-color: var(--y-bad);
}

.btn-outline-success {
    --bs-btn-color: var(--y-ok);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--y-ok-line);
    --bs-btn-hover-color: var(--y-ok);
    --bs-btn-hover-bg: var(--y-ok-bg);
    --bs-btn-hover-border-color: var(--y-ok);
    --bs-btn-active-color: var(--y-ok);
    --bs-btn-active-bg: var(--y-ok-bg);
    --bs-btn-active-border-color: var(--y-ok);
}

.btn-group > .btn { min-height: var(--y-ctl-h-sm); }
.btn-group-sm > .btn { --bs-btn-font-size: var(--y-fs-sm); --bs-btn-padding-x: .65rem; }

.btn-close {
    --bs-btn-close-color: var(--y-text);
    --bs-btn-close-opacity: .65;
    --bs-btn-close-focus-shadow: var(--y-focus);
}

[data-bs-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

/* Indicador de carregamento dentro do botão (htmx). */
.btn .htmx-indicator { display: none; }
.btn .htmx-indicator.htmx-request,
.btn.htmx-request .htmx-indicator { display: inline-block; }
.htmx-request.btn,
.btn[aria-busy="true"] { cursor: progress; }

/* ---------- Campos ---------- */

.form-control,
.form-select {
    min-height: var(--y-ctl-h);
    border-color: var(--y-border);
    border-radius: var(--y-r-md);
    background-color: var(--y-sunken);
    color: var(--y-text);
    font-size: var(--y-fs-md);
    transition: border-color var(--y-fast) ease, box-shadow var(--y-fast) ease, background-color var(--y-fast) ease;
}

textarea.form-control {
    min-height: auto;
    line-height: 1.5;
}

.form-control-sm,
.form-select-sm {
    min-height: var(--y-ctl-h-sm);
    font-size: var(--y-fs-sm);
}

.form-control:hover,
.form-select:hover { border-color: var(--y-text-3); }

.form-control:focus,
.form-select:focus {
    border-color: var(--y-gold);
    background-color: var(--y-sunken);
    color: var(--y-text);
    box-shadow: var(--y-focus);
}

.form-control::placeholder { color: var(--y-text-3); opacity: 1; }

.form-control:disabled,
.form-select:disabled,
.form-control[readonly] {
    border-color: var(--y-border-soft);
    background-color: color-mix(in srgb, var(--y-sunken) 60%, transparent);
    color: var(--y-text-2);
}

.form-select {
    --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%239a958b' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

.form-control.is-invalid,
.form-select.is-invalid { border-color: var(--y-bad); }

.form-label {
    margin-bottom: .35rem;
    font-size: var(--y-fs-sm);
    font-weight: 600;
    color: var(--y-text-2);
}

.form-text {
    margin-top: .3rem;
    font-size: var(--y-fs-sm);
    color: var(--y-text-3);
}

.input-group-text {
    border-color: var(--y-border);
    background: var(--y-raised);
    color: var(--y-text-2);
    font-size: var(--y-fs-sm);
}

.input-group-sm > .form-control,
.input-group-sm > .input-group-text { min-height: var(--y-ctl-h-sm); }

.form-check-input {
    border-color: var(--y-text-3);
    background-color: var(--y-sunken);
    cursor: pointer;
}

.form-check-input:checked,
.form-check-input:indeterminate {
    border-color: var(--y-gold);
    background-color: var(--y-gold);
}

.form-check-input:checked[type="checkbox"] {
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%2316130c' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}

.form-check-input:checked[type="radio"] {
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%2316130c'/%3e%3c/svg%3e");
}

.form-check-input:focus { box-shadow: var(--y-focus); border-color: var(--y-gold); }

.form-switch .form-check-input {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%239a958b'/%3e%3c/svg%3e");
}

.form-switch .form-check-input:checked {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2316130c'/%3e%3c/svg%3e");
}

.form-floating > .form-control { min-height: 3.4rem; }
.form-floating > label { color: var(--y-text-3); }
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label { color: var(--y-text-2); }
.form-floating > .form-control:focus ~ label::after,
.form-floating > .form-control:not(:placeholder-shown) ~ label::after { background: transparent; }

.y-form-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin-top: 1.1rem;
}

.y-panel .y-form-actions:first-child,
.d-flex > .y-form-actions { margin-top: 0; }

/* ---------- Tabelas ---------- */

.table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--y-text);
    --bs-table-border-color: var(--y-border-soft);
    --bs-table-hover-bg: var(--y-hover);
    --bs-table-hover-color: var(--y-text);
    --bs-table-striped-bg: var(--y-hover);
    font-size: var(--y-fs-md);
}

.table > :not(caption) > * > * {
    padding: .7rem .65rem;
    border-bottom-color: var(--y-border-soft);
}

.table > thead th {
    padding-top: .6rem;
    padding-bottom: .6rem;
    background: var(--y-surface);
    font-size: var(--y-fs-sm);
    font-weight: 600;
    color: var(--y-text-2);
    white-space: nowrap;
}

.table > tbody > tr:last-child > * { border-bottom: 0; }

.table td a {
    font-weight: 600;
    color: var(--y-text);
}

.table td a:hover { color: var(--y-gold-text); }

.table-responsive { position: relative; }

/* Cabeçalho fixo: a tabela rola dentro do painel e os títulos ficam no topo. */
.y-table-scroll {
    max-height: calc(100dvh - 18rem);
    min-height: 16rem;
    overflow: auto;
}

.y-table-scroll > .table > thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    box-shadow: inset 0 -1px 0 var(--y-border-soft);
}

.y-nowrap { white-space: nowrap; }

.y-row-link { cursor: pointer; }

/* Ações discretas por linha: aparecem fortes no hover e no foco. */
.y-row-actions {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
}

.y-row-del {
    display: inline-grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border: 1px solid transparent;
    border-radius: var(--y-r-md);
    background: transparent;
    color: var(--y-text-3);
    transition: color var(--y-fast) ease, background-color var(--y-fast) ease, border-color var(--y-fast) ease;
}

.y-row-del:hover,
.y-row-del:focus-visible {
    border-color: var(--y-bad-line);
    background: var(--y-bad-bg);
    color: var(--y-bad);
}

.y-check-col { width: 2.5rem; }

/* ---------- Selos ---------- */

.badge {
    --bs-badge-font-size: var(--y-fs-xs);
    --bs-badge-font-weight: 600;
    --bs-badge-padding-x: .55em;
    --bs-badge-padding-y: .3em;
    --bs-badge-border-radius: var(--y-r-pill);
    max-width: 100%;
    overflow: hidden;
    letter-spacing: 0;
    line-height: 1.25;
    text-overflow: ellipsis;
    text-transform: none;
    vertical-align: .05em;
}

.badge.text-bg-primary { background: var(--y-gold-soft) !important; color: var(--y-gold-text) !important; }
.badge.text-bg-secondary { background: var(--y-raised) !important; color: var(--y-text-2) !important; }
.badge.text-bg-success { background: var(--y-ok-bg) !important; color: var(--y-ok) !important; }
.badge.text-bg-danger { background: var(--y-bad-bg) !important; color: var(--y-bad) !important; }
.badge.text-bg-warning { background: var(--y-warn-bg) !important; color: var(--y-warn) !important; }
.badge.text-bg-info { background: var(--y-info-bg) !important; color: var(--y-info) !important; }
.badge.text-bg-dark { background: var(--y-raised) !important; color: var(--y-text) !important; }
.badge.text-bg-light {
    border: 1px solid var(--y-border-soft);
    background: var(--y-sunken) !important;
    color: var(--y-text-2) !important;
}

.badge.text-bg-gold { background: var(--y-c-gold-bg) !important; color: var(--y-c-gold-fg) !important; }
.badge.text-bg-rose { background: var(--y-c-rose-bg) !important; color: var(--y-c-rose-fg) !important; }
.badge.text-bg-violet { background: var(--y-c-violet-bg) !important; color: var(--y-c-violet-fg) !important; }
.badge.text-bg-teal { background: var(--y-c-teal-bg) !important; color: var(--y-c-teal-fg) !important; }
.badge.text-bg-orange { background: var(--y-c-orange-bg) !important; color: var(--y-c-orange-fg) !important; }
.badge.text-bg-lime { background: var(--y-c-lime-bg) !important; color: var(--y-c-lime-fg) !important; }
.badge.text-bg-slate { background: var(--y-c-slate-bg) !important; color: var(--y-c-slate-fg) !important; }

/* Cor livre de etapa (#rrggbb vindo do seletor): selo suave a partir de --sc. */
.badge.stage-hex {
    background: color-mix(in srgb, var(--sc) 18%, transparent) !important;
    color: color-mix(in srgb, var(--sc) 55%, var(--y-text)) !important;
}

/* Tags coloridas por grupo (cor em --tc). */
.badge.y-tag {
    border: 1px solid color-mix(in srgb, var(--tc) 32%, transparent);
    background: color-mix(in srgb, var(--tc) 15%, transparent) !important;
    color: color-mix(in srgb, var(--tc) 50%, var(--y-text)) !important;
    font-weight: 600;
}

.crm-dot {
    display: inline-block;
    flex-shrink: 0;
    width: 9px;
    height: 9px;
    margin-right: .4rem;
    border-radius: 50%;
    vertical-align: .05rem;
}

.crm-dot.text-bg-gold { background: var(--y-c-gold) !important; }
.crm-dot.text-bg-rose { background: var(--y-c-rose) !important; }
.crm-dot.text-bg-violet { background: var(--y-c-violet) !important; }
.crm-dot.text-bg-teal { background: var(--y-c-teal) !important; }
.crm-dot.text-bg-orange { background: var(--y-c-orange) !important; }
.crm-dot.text-bg-lime { background: var(--y-c-lime) !important; }
.crm-dot.text-bg-slate { background: var(--y-c-slate) !important; }
.crm-dot.stage-hex { background: var(--sc) !important; }

/* Estado com texto, ícone e cor (nunca só cor). */
.y-state {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    max-width: 100%;
    padding: .2rem .6rem;
    border: 1px solid var(--y-border);
    border-radius: var(--y-r-pill);
    background: var(--y-sunken);
    color: var(--y-text-2);
    font-size: var(--y-fs-xs);
    font-weight: 600;
    line-height: 1.35;
    white-space: nowrap;
}

.y-state .bi { font-size: .85em; }
.y-state-ok { border-color: var(--y-ok-line); background: var(--y-ok-bg); color: var(--y-ok); }
.y-state-warn { border-color: var(--y-warn-line); background: var(--y-warn-bg); color: var(--y-warn); }
.y-state-bad { border-color: var(--y-bad-line); background: var(--y-bad-bg); color: var(--y-bad); }
.y-state-info { border-color: var(--y-info-line); background: var(--y-info-bg); color: var(--y-info); }
.y-state-gold { border-color: var(--y-gold-line); background: var(--y-gold-soft); color: var(--y-gold-text); }

/* Agente ligado/desligado no topo das páginas. */
.y-status {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    height: var(--y-ctl-h);
    padding: 0 .85rem;
    border: 1px solid var(--y-border);
    border-radius: var(--y-r-pill);
    background: var(--y-surface);
    font-size: var(--y-fs-sm);
    font-weight: 600;
    color: var(--y-text);
}

.y-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
}

.y-status-on { border-color: var(--y-ok-line); color: var(--y-ok); }
.y-status-on .y-status-dot { box-shadow: 0 0 0 3px var(--y-ok-bg); }
.y-status-off { border-color: var(--y-bad-line); color: var(--y-bad); }
.y-status-off .y-status-dot { box-shadow: 0 0 0 3px var(--y-bad-bg); }

/* ---------- Abas e filtros ---------- */

.nav-tabs {
    --bs-nav-tabs-border-color: var(--y-border-soft);
    --bs-nav-tabs-link-active-color: var(--y-text);
    --bs-nav-tabs-link-active-bg: transparent;
    --bs-nav-tabs-link-active-border-color: transparent transparent var(--y-gold);
}

.nav-tabs .nav-link { color: var(--y-text-2); border-width: 0 0 2px; }
.nav-tabs .nav-link:hover { color: var(--y-text); border-color: transparent; }

.nav-pills {
    --bs-nav-pills-link-active-bg: var(--y-gold-soft);
    --bs-nav-pills-link-active-color: var(--y-text);
}

/* Abas segmentadas (Tarefas, filtros curtos) com contador. */
.y-seg-tabs {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 2px;
    padding: 3px;
    border: 1px solid var(--y-border-soft);
    border-radius: calc(var(--y-r-md) + 3px);
    background: var(--y-sunken);
}

.y-seg-tabs .nav-link {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    min-height: 34px;
    padding: .3rem .9rem;
    border-radius: var(--y-r-md);
    color: var(--y-text-2);
    font-size: var(--y-fs-sm);
    font-weight: 600;
    transition: background-color var(--y-fast) ease, color var(--y-fast) ease;
}

.y-seg-tabs .nav-link:hover { background: var(--y-hover); color: var(--y-text); }

.y-seg-tabs .nav-link.active {
    background: var(--y-raised);
    color: var(--y-text);
    box-shadow: inset 0 0 0 1px var(--y-border), 0 1px 2px rgba(0, 0, 0, .15);
}

.y-seg-count {
    min-width: 1.35rem;
    padding: 0 .35rem;
    border-radius: var(--y-r-pill);
    background: var(--y-border-soft);
    color: var(--y-text-2);
    font-size: var(--y-fs-xs);
    line-height: 1.3rem;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.nav-link.active .y-seg-count { background: var(--y-gold-soft); color: var(--y-gold-text); }
.y-seg-count.is-alert { background: var(--y-bad-bg); color: var(--y-bad); }

/* Chips de período (consumo) */
.y-chips { display: flex; flex-wrap: wrap; gap: .4rem; }

.y-chip {
    display: inline-flex;
    align-items: center;
    min-height: var(--y-ctl-h-sm);
    padding: 0 .85rem;
    border: 1px solid var(--y-border);
    border-radius: var(--y-r-pill);
    background: transparent;
    color: var(--y-text-2);
    font-size: var(--y-fs-sm);
    font-weight: 500;
}

.y-chip:hover { border-color: var(--y-text-3); color: var(--y-text); }

.y-chip.active {
    border-color: var(--y-gold-line);
    background: var(--y-gold-soft);
    color: var(--y-text);
    font-weight: 600;
}

/* Subnavegação lateral (Config IA) */
.y-subnav {
    position: sticky;
    top: calc(var(--y-topbar-h) + 1rem);
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: .4rem;
    border: 1px solid var(--y-border-soft);
    border-radius: var(--y-r-lg);
    background: var(--y-surface);
}

.y-subnav a {
    position: relative;
    display: flex;
    align-items: center;
    gap: .6rem;
    min-height: 38px;
    padding: .4rem .65rem;
    border-radius: var(--y-r-md);
    color: var(--y-text-2);
    font-size: var(--y-fs-sm);
    font-weight: 500;
}

.y-subnav a i { color: var(--y-text-3); }
.y-subnav a:hover { background: var(--y-hover); color: var(--y-text); }
.y-subnav a.is-active { background: var(--y-gold-soft); color: var(--y-text); font-weight: 600; }
.y-subnav a.is-active i { color: var(--y-gold); }

/* ---------- Sobreposições: menus, modais, painéis ---------- */

.dropdown-menu {
    --bs-dropdown-bg: var(--y-raised);
    --bs-dropdown-color: var(--y-text);
    --bs-dropdown-border-color: var(--y-border);
    --bs-dropdown-border-radius: var(--y-r-lg);
    --bs-dropdown-link-color: var(--y-text);
    --bs-dropdown-link-hover-color: var(--y-text);
    --bs-dropdown-link-hover-bg: var(--y-hover);
    --bs-dropdown-link-active-color: var(--y-text);
    --bs-dropdown-link-active-bg: var(--y-gold-soft);
    --bs-dropdown-header-color: var(--y-text-3);
    --bs-dropdown-divider-bg: var(--y-border-soft);
    --bs-dropdown-font-size: var(--y-fs-md);
    --bs-dropdown-padding-y: .35rem;
    --bs-dropdown-item-padding-y: .45rem;
    box-shadow: var(--y-shadow-pop);
}

.dropdown-menu.show { animation: y-pop var(--y-fast) var(--y-ease); }

.dropdown-item {
    display: flex;
    align-items: center;
    gap: .5rem;
    border-radius: 0;
}

.dropdown-item.text-danger { color: var(--y-bad) !important; }
.dropdown-item.text-danger:hover { background: var(--y-bad-bg); }

.dropdown-header {
    font-size: var(--y-fs-xs);
    font-weight: 600;
}

.modal {
    --bs-modal-bg: var(--y-raised);
    --bs-modal-color: var(--y-text);
    --bs-modal-border-color: var(--y-border);
    --bs-modal-border-radius: var(--y-r-xl);
    --bs-modal-inner-border-radius: calc(var(--y-r-xl) - 1px);
    --bs-modal-header-border-color: var(--y-border-soft);
    --bs-modal-footer-border-color: var(--y-border-soft);
    --bs-modal-box-shadow: var(--y-shadow-pop);
}

.modal-content { box-shadow: var(--y-shadow-pop); }
.modal-title { font-size: var(--y-fs-lg); font-weight: 650; }
.modal-backdrop { --bs-backdrop-bg: #050506; --bs-backdrop-opacity: .6; }

.offcanvas {
    --bs-offcanvas-bg: var(--y-raised);
    --bs-offcanvas-color: var(--y-text);
    --bs-offcanvas-border-color: var(--y-border);
    --bs-offcanvas-box-shadow: var(--y-shadow-pop);
}

.popover,
.tooltip {
    --bs-popover-bg: var(--y-raised);
    --bs-popover-border-color: var(--y-border);
    --bs-tooltip-bg: var(--y-raised);
    --bs-tooltip-color: var(--y-text);
}

/* ---------- Avisos ---------- */

.alert {
    --bs-alert-border-radius: var(--y-r-lg);
    --bs-alert-padding-y: .7rem;
    --bs-alert-padding-x: 1rem;
    font-size: var(--y-fs-md);
}

.alert-success { --bs-alert-color: var(--y-ok); --bs-alert-bg: var(--y-ok-bg); --bs-alert-border-color: var(--y-ok-line); }
.alert-warning { --bs-alert-color: var(--y-warn); --bs-alert-bg: var(--y-warn-bg); --bs-alert-border-color: var(--y-warn-line); }
.alert-danger { --bs-alert-color: var(--y-bad); --bs-alert-bg: var(--y-bad-bg); --bs-alert-border-color: var(--y-bad-line); }
.alert-info { --bs-alert-color: var(--y-info); --bs-alert-bg: var(--y-info-bg); --bs-alert-border-color: var(--y-info-line); }
.alert .bi { flex-shrink: 0; }
.alert a { color: inherit; font-weight: 600; text-decoration: underline; }

/* Notificações temporárias (canto inferior direito). Erros que pedem ação ficam como
 * aviso fixo na página, não aqui. */
.y-toasts {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 2100;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    width: min(380px, calc(100vw - 2rem));
    pointer-events: none;
}

.y-toast {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    padding: .75rem .9rem;
    border: 1px solid var(--y-border);
    border-left: 3px solid var(--y-ok);
    border-radius: var(--y-r-lg);
    background: var(--y-raised);
    box-shadow: var(--y-shadow-pop);
    color: var(--y-text);
    font-size: var(--y-fs-md);
    pointer-events: auto;
    animation: y-toast-in var(--y-mid) var(--y-ease);
}

.y-toast > .bi { margin-top: .1rem; color: var(--y-ok); }
.y-toast.is-error { border-left-color: var(--y-bad); }
.y-toast.is-error > .bi { color: var(--y-bad); }
.y-toast.is-warn { border-left-color: var(--y-warn); }
.y-toast.is-warn > .bi { color: var(--y-warn); }
.y-toast-body { flex: 1; min-width: 0; }
.y-toast-action {
    flex-shrink: 0;
    padding: 0;
    border: 0;
    background: none;
    color: var(--y-gold-text);
    font-weight: 600;
}
.y-toast-close {
    flex-shrink: 0;
    padding: 0 .1rem;
    border: 0;
    background: none;
    color: var(--y-text-3);
    line-height: 1;
}
.y-toast.is-leaving { opacity: 0; transform: translateY(6px); transition: opacity .2s ease, transform .2s ease; }

@keyframes y-toast-in {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: none; }
}

/* ---------- Paginação ---------- */

.pagination {
    --bs-pagination-bg: transparent;
    --bs-pagination-color: var(--y-text);
    --bs-pagination-border-color: var(--y-border);
    --bs-pagination-hover-bg: var(--y-hover);
    --bs-pagination-hover-color: var(--y-text);
    --bs-pagination-active-bg: var(--y-gold-soft);
    --bs-pagination-active-color: var(--y-text);
    --bs-pagination-active-border-color: var(--y-gold-line);
}

.y-pager {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .7rem 1.1rem;
    border-top: 1px solid var(--y-border-soft);
    font-size: var(--y-fs-sm);
    color: var(--y-text-2);
}

.y-pager-info strong,
.y-pager-page strong { color: var(--y-text); font-variant-numeric: tabular-nums; }

.y-pager-nav { display: flex; align-items: center; gap: .5rem; }
.y-pager-page { padding: 0 .35rem; white-space: nowrap; }

.y-pager-btn {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-height: var(--y-ctl-h-sm);
    padding: 0 .8rem;
    border: 1px solid var(--y-border);
    border-radius: var(--y-r-md);
    color: var(--y-text);
    font-weight: 600;
    transition: background-color var(--y-fast) ease, border-color var(--y-fast) ease;
}

.y-pager-btn:hover { background: var(--y-hover); border-color: var(--y-text-3); color: var(--y-text); }

.y-pager-btn.is-disabled {
    pointer-events: none;
    border-color: var(--y-border-soft);
    color: var(--y-text-3);
    opacity: .6;
}

@media (max-width: 575.98px) {
    .y-pager-btn span { display: none; }
}

/* ---------- Estados vazios e carregando ---------- */

.y-empty-state {
    max-width: 520px;
    margin: 0 auto;
    padding: 2.5rem 1.5rem;
    text-align: center;
}

.y-empty-state h2 { margin: .9rem 0 .35rem; font-size: var(--y-fs-lg); }
.y-empty-state p { color: var(--y-text-2); }

.y-empty-icon {
    display: inline-grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border: 1px solid var(--y-border-soft);
    border-radius: 50%;
    background: var(--y-sunken);
    color: var(--y-text-2);
    font-size: 1.45rem;
}

.y-muted-empty {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0;
    font-size: var(--y-fs-md);
    color: var(--y-text-2);
}

/* Estado vazio dentro de tabela (uma linha só, centralizada). */
.y-table-empty td { padding: 0 !important; border: 0; }

.y-empty-row {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .4rem;
    padding: 2.25rem 1.25rem;
    text-align: center;
    color: var(--y-text-2);
}

.y-empty-row .bi { font-size: 1.5rem; color: var(--y-text-3); }
.y-empty-row strong { color: var(--y-text); }
.y-empty-row .btn { margin-top: .4rem; }

.spinner-border { --bs-spinner-border-width: .15em; }

/* Bloco reservado enquanto carrega: o conteúdo não pula quando chega. */
.y-skeleton {
    display: block;
    border-radius: var(--y-r-md);
    background: linear-gradient(90deg, var(--y-sunken) 0%, var(--y-raised) 50%, var(--y-sunken) 100%) 0 0 / 200% 100%;
    animation: y-shimmer 1.2s linear infinite;
}

@keyframes y-shimmer { to { background-position: -200% 0; } }

.y-loading {
    display: flex;
    align-items: center;
    gap: .5rem;
    min-height: 4.5rem;
    padding: 1rem 1.1rem;
    font-size: var(--y-fs-sm);
    color: var(--y-text-2);
}

/* ---------- Fatos, listas e linha do tempo ---------- */

.y-facts {
    display: grid;
    grid-template-columns: minmax(120px, 36%) 1fr;
    gap: .55rem 1rem;
    margin: 0;
    font-size: var(--y-fs-md);
}

.y-facts dt { font-weight: 500; color: var(--y-text-2); }
.y-facts dd { margin: 0; color: var(--y-text); overflow-wrap: anywhere; }
.y-facts-text { white-space: pre-line; }
.y-facts-divider { margin: 1.1rem 0; border-top: 1px solid var(--y-border-soft); }

@media (max-width: 575.98px) {
    .y-facts { grid-template-columns: 1fr; gap: .1rem; }
    .y-facts dd { margin-bottom: .55rem; }
}

.y-list { margin: 0; padding: 0; list-style: none; }

.y-list > li {
    display: flex;
    align-items: baseline;
    gap: .6rem;
    padding: .7rem 1.1rem;
    border-bottom: 1px solid var(--y-border-soft);
    font-size: var(--y-fs-md);
}

.y-list > li:last-child { border-bottom: 0; }
.y-list > li > span { flex: 1; min-width: 0; }
.y-list > li > .bi { color: var(--y-text-3); }
.y-list > li > small { color: var(--y-text-2); white-space: nowrap; }
.y-list > li.y-list-empty { color: var(--y-text-2); }

.y-timeline > li.y-timeline-item { display: block; }
.y-timeline-top { display: flex; justify-content: space-between; gap: .75rem; }
.y-timeline-top strong { font-weight: 600; color: var(--y-text); }
.y-timeline-top small { flex-shrink: 0; color: var(--y-text-3); }
.y-timeline-detail {
    margin-top: .2rem;
    font-size: var(--y-fs-sm);
    color: var(--y-text-2);
    white-space: pre-line;
    overflow-wrap: anywhere;
}

/* ---------- Peças de formulário ---------- */

.y-dropzone {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .9rem;
    padding: 1rem 1.1rem;
    border: 1.5px dashed var(--y-border);
    border-radius: var(--y-r-lg);
    background: var(--y-sunken);
    transition: border-color var(--y-fast) ease, background-color var(--y-fast) ease;
}

.y-dropzone > .bi { font-size: 1.6rem; color: var(--y-text-3); }
.y-dropzone.is-drag { border-color: var(--y-gold); background: var(--y-gold-soft); }
.y-dropzone label { cursor: pointer; color: var(--y-text); }

.y-dropzone-input {
    display: block;
    max-width: 100%;
    margin-top: .4rem;
    font-size: var(--y-fs-sm);
    color: var(--y-text-2);
}

.y-dropzone-input::file-selector-button {
    margin-right: .6rem;
    padding: .25rem .7rem;
    border: 1px solid var(--y-border);
    border-radius: var(--y-r-md);
    background: var(--y-raised);
    color: var(--y-text);
    font-weight: 600;
    cursor: pointer;
}

.y-dropzone-title { flex: 0 1 200px; min-width: 150px; }

.y-filelist {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.y-filelist li {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: .6rem .8rem;
    border: 1px solid var(--y-border-soft);
    border-radius: var(--y-r-md);
}

.y-fileicon {
    display: grid;
    flex-shrink: 0;
    place-items: center;
    width: 36px;
    height: 42px;
    border-radius: var(--y-r-sm);
    background: var(--y-raised);
    color: var(--y-text-2);
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.y-fileicon-pdf { background: var(--y-bad-bg); color: var(--y-bad); }
.y-fileicon-docx { background: var(--y-info-bg); color: var(--y-info); }
.y-fileicon-md { background: var(--y-gold-soft); color: var(--y-gold-text); }

/* Liga/desliga grande (agente, aviso do comercial) */
.y-killswitch {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.1rem;
    border: 1px solid var(--y-bad-line);
    border-radius: var(--y-r-lg);
    background: var(--y-bad-bg);
    cursor: pointer;
    transition: background-color var(--y-fast) ease, border-color var(--y-fast) ease;
}

.y-killswitch strong,
.y-tool strong { display: block; color: var(--y-text); }
.y-killswitch small { display: block; font-size: var(--y-fs-sm); color: var(--y-text-2); }

.y-killswitch-icon {
    display: grid;
    flex-shrink: 0;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--y-bad-solid);
    color: #fff;
    font-size: 1.1rem;
}

.y-killswitch.is-on { border-color: var(--y-ok-line); background: var(--y-ok-bg); }
.y-killswitch.is-on .y-killswitch-icon { background: var(--bs-success); color: #fff; }

.y-killswitch .form-switch .form-check-input,
.y-tool .form-switch .form-check-input { width: 2.6em; height: 1.4em; }

.y-tool-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: .65rem;
}

.y-tool {
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    padding: .8rem .9rem;
    border: 1px solid var(--y-border-soft);
    border-radius: var(--y-r-md);
    cursor: pointer;
    transition: border-color var(--y-fast) ease, background-color var(--y-fast) ease;
}

.y-tool:hover { border-color: var(--y-border); background: var(--y-hover); }
.y-tool:has(input:checked) { border-color: var(--y-gold-line); background: var(--y-gold-soft); }
.y-tool small { display: block; font-size: var(--y-fs-sm); color: var(--y-text-2); }
.y-tool code { display: inline-block; margin-top: .3rem; font-size: var(--y-fs-xs); color: var(--y-text-3); }

/* Chave da OpenAI (Config IA) */
.y-key-status {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .25rem .7rem;
    border: 1px solid var(--y-border);
    border-radius: var(--y-r-pill);
    background: var(--y-sunken);
    color: var(--y-text-2);
    font-size: var(--y-fs-xs);
    font-weight: 600;
    white-space: nowrap;
}

.y-key-dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.y-key-status.is-connected { border-color: var(--y-ok-line); background: var(--y-ok-bg); color: var(--y-ok); }
.y-key-status.is-invalid { border-color: var(--y-bad-line); background: var(--y-bad-bg); color: var(--y-bad); }
.y-key-status.is-checking .y-key-dot { animation: y-blink 1s ease-in-out infinite; }

@keyframes y-blink { 50% { opacity: .25; } }

.y-model-chip {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    height: var(--y-ctl-h);
    padding: 0 .85rem;
    border: 1px solid var(--y-border);
    border-radius: var(--y-r-pill);
    background: var(--y-surface);
    color: var(--y-text);
    font-family: var(--y-mono);
    font-size: var(--y-fs-sm);
    font-weight: 600;
}

.y-model-chip .bi { color: var(--y-gold); }
.y-model-chip small {
    font-family: var(--y-font);
    font-size: var(--y-fs-xs);
    font-weight: 500;
    color: var(--y-text-3);
}

/* Telefone com Ligar / WhatsApp / Copiar */
.y-phone-actions { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .4rem; }

.y-phone-btn {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    min-height: 30px;
    padding: 0 .65rem;
    border: 1px solid var(--y-border);
    border-radius: var(--y-r-pill);
    background: transparent;
    color: var(--y-text-2);
    font-size: var(--y-fs-sm);
    font-weight: 500;
    transition: border-color var(--y-fast) ease, color var(--y-fast) ease, background-color var(--y-fast) ease;
}

.y-phone-btn:hover { border-color: var(--y-text-3); background: var(--y-hover); color: var(--y-text); }
.y-phone-btn.is-copied { border-color: var(--y-ok-line); background: var(--y-ok-bg); color: var(--y-ok); }
.y-phone-btn .bi-whatsapp { color: #3fbf75; }

.y-phone { white-space: nowrap; font-variant-numeric: tabular-nums; }

/* Seletor de tags (formulários) */
.y-tagpick {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem;
    padding: .55rem;
    border: 1px solid var(--y-border);
    border-radius: var(--y-r-md);
    background: var(--y-sunken);
}

.y-tagpick-chips { display: contents; }

.y-tag-chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-height: 30px;
    padding: 0 .7rem;
    border: 1px solid var(--y-border);
    border-radius: var(--y-r-pill);
    background: var(--y-surface);
    color: var(--y-text-2);
    font-size: var(--y-fs-sm);
    font-weight: 500;
    cursor: pointer;
    transition: background-color var(--y-fast) ease, color var(--y-fast) ease, border-color var(--y-fast) ease;
}

.y-tag-chip:hover { border-color: var(--y-text-3); color: var(--y-text); }
.y-tag-chip.is-on { border-color: var(--y-gold-line); background: var(--y-gold-soft); color: var(--y-text); }

.y-tag-chip.y-tag-colored,
.y-tag-chip.y-tag-colored.is-on {
    border-color: color-mix(in srgb, var(--tc) 50%, transparent);
    background: color-mix(in srgb, var(--tc) 20%, transparent);
    color: color-mix(in srgb, var(--tc) 45%, var(--y-text));
}

.y-tag-chip.y-tag-option {
    border-color: color-mix(in srgb, var(--tc) 40%, transparent);
    color: color-mix(in srgb, var(--tc) 45%, var(--y-text));
}

.y-tag-chip.y-tag-option::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--tc);
}

.y-tag-plus { border-style: dashed; background: transparent; color: var(--y-text-2); }
.y-tagpick-add .form-control { width: 200px; border-radius: var(--y-r-pill); }

/* Barra de ações em lote: aparece com seleção. */
.y-bulk-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem .75rem;
    margin-bottom: .75rem;
    padding: .55rem .6rem .55rem 1rem;
    border: 1px solid var(--y-border);
    border-radius: var(--y-r-lg);
    background: var(--y-raised);
    box-shadow: var(--y-shadow-pop);
    font-size: var(--y-fs-md);
    color: var(--y-text);
}

.y-bulk-bar[hidden] { display: none; }
.y-bulk-bar strong { font-variant-numeric: tabular-nums; }

.y-bulk-bar.is-sticky {
    position: sticky;
    top: calc(var(--y-topbar-h) + .5rem);
    z-index: 5;
    animation: y-pop var(--y-mid) var(--y-ease);
}

.y-bulk-tag {
    border-color: var(--y-warn-line);
    background: var(--y-warn-bg);
    box-shadow: none;
}

/* ---------- Janela de confirmação ---------- */

.y-confirm {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: grid;
    place-items: center;
    padding: 1rem;
}

.y-confirm[hidden] { display: none; }

.y-confirm-backdrop {
    position: absolute;
    inset: 0;
    background: var(--y-scrim);
    backdrop-filter: blur(4px);
    opacity: 0;
    transition: opacity .18s ease;
}

.y-confirm-card {
    position: relative;
    width: min(420px, 100%);
    padding: 1.5rem 1.4rem 1.25rem;
    border: 1px solid var(--y-border);
    border-radius: var(--y-r-xl);
    background: var(--y-raised);
    box-shadow: var(--y-shadow-pop);
    text-align: center;
    opacity: 0;
    transform: translateY(10px) scale(.97);
    transition: opacity .18s ease, transform .22s var(--y-ease);
}

.y-confirm.is-open .y-confirm-backdrop { opacity: 1; }
.y-confirm.is-open .y-confirm-card { opacity: 1; transform: none; }

.y-confirm-icon {
    display: inline-grid;
    place-items: center;
    width: 48px;
    height: 48px;
    margin-bottom: .75rem;
    border-radius: 50%;
    background: var(--y-gold-soft);
    color: var(--y-gold-text);
    font-size: 1.35rem;
}

.y-confirm.is-danger .y-confirm-icon { background: var(--y-bad-bg); color: var(--y-bad); }

.y-confirm-title {
    margin: 0 0 .4rem;
    font-size: var(--y-fs-lg);
    font-weight: 650;
    word-break: break-word;
}

.y-confirm-text { margin: 0 0 1.25rem; font-size: var(--y-fs-md); color: var(--y-text-2); }

.y-confirm-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }

/* ---------- Barra "Tudo salvo" (Config IA) ---------- */

.y-legacy-save { display: none !important; }

.y-savebar {
    position: fixed;
    right: 1.5rem;
    bottom: 1.25rem;
    z-index: 1030;
    display: flex;
    align-items: center;
    gap: .9rem;
    padding: .45rem .5rem .45rem 1rem;
    border: 1px solid var(--y-border);
    border-radius: var(--y-r-pill);
    background: var(--y-raised);
    box-shadow: var(--y-shadow-pop);
    transition: border-color var(--y-mid) ease;
}

.y-savebar-msg { font-size: var(--y-fs-sm); font-weight: 600; color: var(--y-ok); }
.y-savebar-btn { border-radius: var(--y-r-pill); padding-inline: 1.1rem; }
.y-savebar-arrow { display: none; }

.y-savebar.is-dirty { border-color: var(--y-gold-line); }
.y-savebar.is-dirty .y-savebar-msg { color: var(--y-warn); }

.y-savebar-count {
    margin-left: .25rem;
    font-weight: 500;
    color: var(--y-text-2);
}

@media (max-width: 575.98px) {
    .y-savebar { left: 1rem; right: 1rem; justify-content: space-between; }
}

/* Campos com alteração ainda não salva (Config IA). */
.y-dirty-mark {
    display: none;
    margin-left: .4rem;
    padding: .05rem .45rem;
    border-radius: var(--y-r-pill);
    background: var(--y-warn-bg);
    color: var(--y-warn);
    font-size: var(--y-fs-xs);
    font-weight: 600;
}

.y-panel-head > .y-dirty-mark { margin-left: auto; }
.y-panel-head > .y-dirty-mark + a,
.y-panel-head > .y-dirty-mark + .badge,
.y-panel-head > .y-dirty-mark + .y-key-status,
.y-panel-head > .y-dirty-mark + span,
.y-panel-head > .y-dirty-mark + #key-status { margin-left: .5rem; }
.is-dirty .y-panel-head .y-dirty-mark,
form.is-dirty .y-dirty-mark { display: inline-block; }

/* ---------- Tabelas no celular: cada linha vira um cartão ----------
 * <table class="table y-table-stack"> e <td data-label="Prazo">: o rótulo aparece acima
 * do valor. Caixinha de seleção à esquerda e ação de excluir no canto. */
@media (max-width: 767.98px) {
    .y-table-scroll { max-height: none; overflow: visible; }

    .y-table-stack,
    .y-table-stack > tbody,
    .y-table-stack > tbody > tr,
    .y-table-stack > tbody > tr > td {
        display: block;
        width: 100%;
    }

    .y-table-stack > thead { display: none; }

    .y-table-stack > tbody > tr {
        position: relative;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .35rem 1rem;
        padding: .75rem 1rem;
        border-bottom: 1px solid var(--y-border-soft);
    }

    /* Campos curtos lado a lado; título, tags e ações na largura toda. */
    .y-table-stack > tbody > tr > td:not([data-label]),
    .y-table-stack > tbody > tr > td.y-tags-cell,
    .y-table-stack > tbody > tr > td[data-label="Nome"],
    .y-table-stack > tbody > tr > td[data-label="Cadência ou motivo"] { grid-column: 1 / -1; }

    .y-table-stack > tbody > tr:last-child { border-bottom: 0; }

    .y-panel .y-table-stack > :not(caption) > * > *,
    .y-table-stack > tbody > tr > td {
        padding: .2rem 0 !important;
        border: 0;
        box-shadow: none !important;
        text-align: left !important;
    }

    .y-table-stack > tbody > tr > td[data-label]::before {
        content: attr(data-label);
        display: block;
        margin-bottom: .05rem;
        font-size: var(--y-fs-xs);
        font-weight: 500;
        color: var(--y-text-3);
    }

    .y-table-stack > tbody > tr:has(> td.y-check-col:first-child) { padding-left: 2.85rem; }
    .y-table-stack > tbody > tr > td.y-check-col:first-child { position: absolute; top: .9rem; left: 1rem; width: auto; }
    .y-table-stack > tbody > tr > td.y-check-col { grid-column: auto !important; }
    .y-table-stack > tbody > tr > td.y-check-col:last-child { position: absolute; top: .55rem; right: .75rem; width: auto; }
    .y-table-stack > tbody > tr.is-late { box-shadow: inset 3px 0 0 var(--bs-danger); }
    .y-table-stack > tbody > tr.is-soon { box-shadow: inset 3px 0 0 var(--y-warn); }
    .y-table-stack .y-row-actions,
    .y-table-stack .fu-actions { justify-content: flex-start; margin-top: .35rem; }
    .y-table-stack .fu-reschedule { margin-left: 0; }
    .y-table-stack .fu-reschedule-note { text-align: left; }
    .y-table-stack > tbody > tr.y-table-empty { padding: 0; }

    .fu-filters .btn-group { flex-wrap: nowrap !important; max-width: 100%; overflow-x: auto; }
    .fu-filters .btn-group > .btn { white-space: nowrap; }
}