/* ==========================================================================
   Total Agents — camada visual de componentes

   Carregada depois de Tailwind/style/dashboard para traduzir a linguagem
   visual do prototipo total-agents para os componentes existentes. Layout
   continua em Tailwind; comportamento continua em Jinja/Alpine.
   ========================================================================== */

:root {
    --ta-surface-base: var(--tp-component-surface);
    --ta-surface-subtle: var(--tp-component-surface-subtle);
    --ta-surface-hover: var(--tp-component-surface-hover);
    --ta-surface-active: var(--tp-component-surface-active);
    --ta-border-soft: var(--tp-component-border-soft);
    --ta-border-strong: var(--tp-component-border-strong);
    --ta-radius-sm: var(--tp-component-radius-control);
    --ta-radius-md: var(--tp-component-radius-subcard);
    --ta-radius-lg: var(--tp-component-radius-card);
}

/* Primitivos reutilizaveis para templates compartilhados. */
.ta-surface,
.ta-panel {
    border: 1px solid var(--tp-component-border);
    background:
        linear-gradient(135deg, rgb(var(--tp-gray-000) / 0.045), rgb(var(--tp-gray-000) / 0.012)),
        var(--tp-component-surface);
    box-shadow: var(--tp-component-highlight), var(--tp-component-shadow-card);
    backdrop-filter: blur(var(--tp-blur-glass));
    -webkit-backdrop-filter: blur(var(--tp-blur-glass));
}

.ta-surface {
    border-radius: var(--tp-component-radius-card);
}

.ta-panel {
    border-radius: var(--tp-component-radius-subcard);
}

.ta-control {
    border: 1px solid var(--tp-component-border);
    border-radius: var(--tp-component-radius-control);
    background: var(--tp-component-surface-subtle);
    color: var(--tp-component-text);
    box-shadow: var(--tp-component-highlight);
}

.ta-control:focus,
.ta-control:focus-visible {
    outline: none;
    border-color: var(--tp-component-focus);
    box-shadow: 0 0 0 4px var(--tp-component-focus-soft);
}

.ta-popover {
    border: 1px solid var(--tp-component-border);
    border-radius: var(--tp-component-radius-subcard);
    background: var(--tp-component-surface-raised);
    color: var(--tp-component-text);
    box-shadow: var(--tp-component-highlight), var(--tp-component-shadow-overlay);
    backdrop-filter: blur(var(--tp-blur-glass));
    -webkit-backdrop-filter: blur(var(--tp-blur-glass));
}

.ta-surface-subtle {
    border: 1px solid var(--tp-component-border-soft);
    border-radius: var(--tp-component-radius-subcard);
    background: var(--tp-component-surface-subtle);
}

.ta-surface-plain {
    border: 1px solid var(--tp-component-border);
    border-radius: var(--tp-component-radius-subcard);
    background: rgb(var(--tp-gray-940) / 0.92);
}

.ta-status-success {
    color: var(--tp-color-success-main);
}

.ta-status-warning {
    color: var(--tp-color-warning-main);
}

.ta-status-danger {
    color: var(--tp-color-error-light);
}

.ta-status-info {
    color: var(--tp-color-info-main);
}

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

    100% {
        background-position: 200% 0;
    }
}

.ta-skeleton-shimmer {
    background: linear-gradient(
        90deg,
        var(--tp-component-skeleton-base) 0%,
        var(--tp-component-skeleton-highlight) 50%,
        var(--tp-component-skeleton-base) 100%
    );
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.5s ease-in-out infinite;
}

/* --------------------------------------------------------------------------
   Editorial surfaces
   -------------------------------------------------------------------------- */
.ed-page {
    min-height: 100%;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--tp-component-text);
    box-shadow: none;
}

/* O titulo principal permanece; apenas o rotulo repetido da view e ocultado. */
.ed-page > .ed-page-header .ed-page-header__label {
    display: none;
}

.ed-page--resource-list {
    display: flex;
    flex-direction: column;
}

.ed-resource-layout {
    flex: 1 0 auto;
}

@media (min-width: 1024px) {
    .ed-resource-layout__sidebar {
        border-right: 1px solid var(--tp-component-border);
    }
}

/*
 * Em desktops estreitos (lg, 1024-1279px) a soma sidebar global (320px) +
 * pastas (15rem via lg:w-60) + metas fixas das linhas .ed-row nao cabe e a
 * listagem ganha scroll horizontal. Nesta faixa a coluna de pastas encolhe
 * para 13rem (nomes de pasta ja truncam). Acima de 1280px vale o lg:w-60.
 */
@media (min-width: 1024px) and (max-width: 1279.98px) {
    .ed-resource-layout__sidebar {
        width: 13rem;
    }
}

.ed-surface {
    overflow: hidden;
    border-color: var(--tp-component-border);
    border-radius: var(--tp-component-radius-card);
    background:
        linear-gradient(135deg, rgb(var(--tp-gray-000) / 0.05), rgb(var(--tp-gray-000) / 0.018)),
        var(--tp-component-surface);
    box-shadow: var(--tp-component-highlight), var(--tp-component-shadow-card);
}

.ed-page-header,
.ed-section,
.ed-form-main,
.ed-form-section {
    background: transparent;
}

.ed-page-header,
.ed-section,
.ed-form-section {
    border-color: var(--tp-component-border-soft);
}

.ed-page-header__label,
.ed-section__label,
.ed-form-section__label,
.ed-form-section__num,
.ed-th-label,
.ed-stat__label,
.ed-detail-meta__label,
.ed-form-toc__label {
    color: var(--tp-component-caption);
}

.ed-page-header__title,
.ed-section__title,
.ed-form-section__title,
.ed-row__title,
.ed-stat__value,
.ed-fieldset__legend,
.ed-radio-card__label,
.ed-detail-meta__value,
.ed-empty__title {
    color: var(--tp-component-text);
}

.ed-page-header__subtitle,
.ed-page-header__count,
.ed-section__description,
.ed-form-section__description,
.ed-row__meta,
.ed-row__sub,
.ed-stat__hint,
.ed-radio-card__description,
.ed-empty__description,
.ed-help {
    color: var(--tp-component-text-muted);
}

.ed-row {
    border-color: var(--tp-component-border-soft);
    transition: background-color 160ms ease, box-shadow 160ms ease;
}

.ed-row:hover {
    background: var(--tp-component-surface-hover);
    box-shadow: inset 3px 0 var(--tp-color-primary-main);
}

.ed-row__icon {
    color: var(--tp-component-text-muted);
}

.ed-stat {
    border-color: var(--tp-component-border-soft);
}

/* Big Numbers no nivel da pagina respeitam o gutter horizontal padrao. */
.ed-page > .ed-stats {
    margin-right: 1.5rem;
    margin-left: 1.5rem;
}

.ed-tabs {
    border-color: var(--tp-component-border-soft);
    background: transparent;
}

.ed-tab {
    color: var(--tp-component-text-muted);
}

.ed-tab:hover {
    color: var(--tp-component-text);
}

.ed-tab--active {
    color: var(--tp-color-primary-main);
    border-bottom-color: var(--tp-color-primary-main);
}

.ed-form-toc {
    border-color: var(--tp-component-border-soft);
    background: rgb(var(--tp-gray-999) / 0.24);
}

.ed-form-toc__item {
    border-radius: var(--tp-component-radius-control);
    color: var(--tp-component-text-muted);
}

.ed-form-toc__item:hover {
    color: var(--tp-component-text);
    background: var(--tp-component-surface-hover);
}

.ed-form-toc__item--active {
    border-left-color: var(--tp-color-primary-main);
    background: var(--tp-component-surface-active);
    color: var(--tp-color-primary-main);
}

.ed-form-toc__item--active .ed-form-toc__item-num {
    color: var(--tp-color-primary-main);
}

.ed-divider,
.ed-detail-meta {
    border-color: var(--tp-component-border-soft);
    background: var(--tp-component-surface-subtle);
}

.ed-detail-meta__item {
    border-color: var(--tp-component-border-soft);
}

.ed-save-bar {
    border-color: var(--tp-component-border);
    background: rgb(var(--tp-gray-940) / 0.86);
    box-shadow: 0 -16px 40px rgb(var(--tp-gray-999) / 0.24);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.ed-save-bar__hint {
    color: var(--tp-component-caption);
}

.ed-page .bg-white,
.ed-surface .bg-white,
.ta-surface .bg-white,
.ta-panel .bg-white,
.ta-modal .bg-white,
.ta-popover .bg-white,
.ta-pagination .bg-white {
    background-color: var(--tp-component-surface);
}

.ed-page .bg-zinc-100,
.ed-page .bg-gray-100,
.ed-surface .bg-zinc-100,
.ed-surface .bg-gray-100,
.ta-modal .bg-zinc-100,
.ta-modal .bg-gray-100,
.ta-popover .bg-zinc-100,
.ta-popover .bg-gray-100 {
    background-color: var(--tp-component-surface-hover);
}

.ed-page .bg-zinc-50,
.ed-page .bg-gray-50,
.ed-surface .bg-zinc-50,
.ed-surface .bg-gray-50,
.ta-modal .bg-zinc-50,
.ta-modal .bg-gray-50,
.ta-popover .bg-zinc-50,
.ta-popover .bg-gray-50,
.ta-pagination .bg-zinc-50,
.ta-pagination .bg-gray-50 {
    background-color: var(--tp-component-surface-subtle);
}

.ed-page .border-zinc-100,
.ed-page .border-zinc-200,
.ed-page .border-zinc-300,
.ed-page .border-gray-100,
.ed-page .border-gray-200,
.ed-page .border-gray-300,
.ed-surface .border-zinc-100,
.ed-surface .border-zinc-200,
.ed-surface .border-zinc-300,
.ed-surface .border-gray-100,
.ed-surface .border-gray-200,
.ed-surface .border-gray-300,
.ta-modal .border-zinc-100,
.ta-modal .border-zinc-200,
.ta-modal .border-zinc-300,
.ta-modal .border-gray-100,
.ta-modal .border-gray-200,
.ta-modal .border-gray-300,
.ta-popover .border-zinc-100,
.ta-popover .border-zinc-200,
.ta-popover .border-zinc-300,
.ta-popover .border-gray-100,
.ta-popover .border-gray-200,
.ta-popover .border-gray-300,
.ta-pagination .border-zinc-100,
.ta-pagination .border-zinc-200,
.ta-pagination .border-gray-100,
.ta-pagination .border-gray-200 {
    border-color: var(--tp-component-border);
}

.ed-page .border-zinc-400,
.ed-page .border-gray-400,
.ed-surface .border-zinc-400,
.ed-surface .border-gray-400,
.ta-modal .border-zinc-400,
.ta-modal .border-gray-400,
.ta-popover .border-zinc-400,
.ta-popover .border-gray-400 {
    border-color: var(--tp-component-border-strong);
}

.ed-page .divide-zinc-100 > :not([hidden]) ~ :not([hidden]),
.ed-page .divide-zinc-200 > :not([hidden]) ~ :not([hidden]),
.ed-page .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
.ed-page .divide-gray-200 > :not([hidden]) ~ :not([hidden]),
.ed-surface .divide-zinc-100 > :not([hidden]) ~ :not([hidden]),
.ed-surface .divide-zinc-200 > :not([hidden]) ~ :not([hidden]),
.ed-surface .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
.ed-surface .divide-gray-200 > :not([hidden]) ~ :not([hidden]),
.ta-modal .divide-zinc-100 > :not([hidden]) ~ :not([hidden]),
.ta-modal .divide-zinc-200 > :not([hidden]) ~ :not([hidden]),
.ta-modal .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
.ta-modal .divide-gray-200 > :not([hidden]) ~ :not([hidden]),
.ta-popover .divide-zinc-100 > :not([hidden]) ~ :not([hidden]),
.ta-popover .divide-zinc-200 > :not([hidden]) ~ :not([hidden]),
.ta-popover .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
.ta-popover .divide-gray-200 > :not([hidden]) ~ :not([hidden]),
.ta-pagination .divide-zinc-100 > :not([hidden]) ~ :not([hidden]),
.ta-pagination .divide-zinc-200 > :not([hidden]) ~ :not([hidden]),
.ta-pagination .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
.ta-pagination .divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
    border-color: var(--tp-component-border-soft);
}

.ed-page .text-zinc-900,
.ed-page .text-gray-900,
.ed-surface .text-zinc-900,
.ed-surface .text-gray-900,
.ta-modal .text-zinc-900,
.ta-modal .text-gray-900,
.ta-popover .text-zinc-900,
.ta-popover .text-gray-900,
.ta-pagination .text-zinc-900,
.ta-pagination .text-gray-900 {
    color: var(--tp-component-text);
}

.ed-page .text-zinc-500,
.ed-page .text-zinc-600,
.ed-page .text-zinc-700,
.ed-page .text-zinc-800,
.ed-page .text-gray-500,
.ed-page .text-gray-600,
.ed-page .text-gray-700,
.ed-page .text-gray-800,
.ed-surface .text-zinc-500,
.ed-surface .text-zinc-600,
.ed-surface .text-zinc-700,
.ed-surface .text-zinc-800,
.ed-surface .text-gray-500,
.ed-surface .text-gray-600,
.ed-surface .text-gray-700,
.ed-surface .text-gray-800,
.ta-modal .text-zinc-500,
.ta-modal .text-zinc-600,
.ta-modal .text-zinc-700,
.ta-modal .text-zinc-800,
.ta-modal .text-gray-500,
.ta-modal .text-gray-600,
.ta-modal .text-gray-700,
.ta-modal .text-gray-800,
.ta-popover .text-zinc-500,
.ta-popover .text-zinc-600,
.ta-popover .text-zinc-700,
.ta-popover .text-zinc-800,
.ta-popover .text-gray-500,
.ta-popover .text-gray-600,
.ta-popover .text-gray-700,
.ta-popover .text-gray-800,
.ta-pagination .text-zinc-500,
.ta-pagination .text-zinc-600,
.ta-pagination .text-zinc-700,
.ta-pagination .text-zinc-800,
.ta-pagination .text-gray-500,
.ta-pagination .text-gray-600,
.ta-pagination .text-gray-700,
.ta-pagination .text-gray-800 {
    color: var(--tp-component-text-muted);
}

.ed-page .text-emerald-700,
.ed-surface .text-emerald-700,
.ed-page .text-green-700,
.ed-surface .text-green-700 {
    color: var(--tp-color-success-main);
}

.ed-page .text-amber-700,
.ed-surface .text-amber-700 {
    color: var(--tp-color-warning-main);
}

.ed-page .text-red-700,
.ed-surface .text-red-700 {
    color: var(--tp-color-error-light);
}

.ed-page .text-blue-700,
.ed-surface .text-blue-700 {
    color: var(--tp-color-info-main);
}

.ed-page .bg-green-100,
.ed-page .bg-emerald-100,
.ed-surface .bg-green-100,
.ed-surface .bg-emerald-100 {
    background-color: rgb(var(--tp-green-400) / 0.12);
}

.ed-page .bg-red-100,
.ed-surface .bg-red-100 {
    background-color: rgb(var(--tp-red-500) / 0.12);
}

.ed-page .bg-amber-100,
.ed-surface .bg-amber-100 {
    background-color: rgb(var(--tp-amber-400) / 0.12);
}

.ed-page .border-green-200,
.ed-page .border-emerald-200,
.ed-surface .border-green-200,
.ed-surface .border-emerald-200 {
    border-color: rgb(var(--tp-green-400) / 0.28);
}

.ed-page .border-red-200,
.ed-page .border-red-300,
.ed-surface .border-red-200,
.ed-surface .border-red-300 {
    border-color: rgb(var(--tp-red-500) / 0.28);
}

.ed-page .border-amber-200,
.ed-page .border-amber-300,
.ed-surface .border-amber-200,
.ed-surface .border-amber-300 {
    border-color: rgb(var(--tp-amber-400) / 0.28);
}

.ed-page .hover\:bg-white:hover,
.ed-page .hover\:bg-zinc-50:hover,
.ed-page .hover\:bg-gray-50:hover,
.ed-surface .hover\:bg-white:hover,
.ed-surface .hover\:bg-zinc-50:hover,
.ed-surface .hover\:bg-gray-50:hover,
.ta-modal .hover\:bg-white:hover,
.ta-modal .hover\:bg-zinc-50:hover,
.ta-modal .hover\:bg-gray-50:hover,
.ta-popover .hover\:bg-white:hover,
.ta-popover .hover\:bg-zinc-50:hover,
.ta-popover .hover\:bg-gray-50:hover,
.ta-pagination .hover\:bg-white:hover,
.ta-pagination .hover\:bg-zinc-50:hover,
.ta-pagination .hover\:bg-gray-50:hover {
    background-color: var(--tp-component-surface-hover);
}

.ed-page .hover\:bg-zinc-100:hover,
.ed-page .hover\:bg-gray-100:hover,
.ed-surface .hover\:bg-zinc-100:hover,
.ed-surface .hover\:bg-gray-100:hover,
.ta-modal .hover\:bg-zinc-100:hover,
.ta-modal .hover\:bg-gray-100:hover,
.ta-popover .hover\:bg-zinc-100:hover,
.ta-popover .hover\:bg-gray-100:hover {
    background-color: var(--tp-component-surface-active);
}

.ed-page .hover\:border-zinc-300:hover,
.ed-page .hover\:border-zinc-400:hover,
.ed-page .hover\:border-gray-300:hover,
.ed-page .hover\:border-gray-400:hover,
.ed-surface .hover\:border-zinc-300:hover,
.ed-surface .hover\:border-zinc-400:hover,
.ed-surface .hover\:border-gray-300:hover,
.ed-surface .hover\:border-gray-400:hover,
.ta-modal .hover\:border-zinc-300:hover,
.ta-modal .hover\:border-zinc-400:hover,
.ta-modal .hover\:border-gray-300:hover,
.ta-modal .hover\:border-gray-400:hover,
.ta-popover .hover\:border-zinc-300:hover,
.ta-popover .hover\:border-zinc-400:hover,
.ta-popover .hover\:border-gray-300:hover,
.ta-popover .hover\:border-gray-400:hover {
    border-color: var(--tp-component-border-strong);
}

.ed-page .hover\:text-zinc-700:hover,
.ed-page .hover\:text-zinc-900:hover,
.ed-page .hover\:text-gray-700:hover,
.ed-page .hover\:text-gray-900:hover,
.ed-page .hover\:text-white:hover,
.ed-surface .hover\:text-zinc-700:hover,
.ed-surface .hover\:text-zinc-900:hover,
.ed-surface .hover\:text-gray-700:hover,
.ed-surface .hover\:text-gray-900:hover,
.ed-surface .hover\:text-white:hover,
.ta-modal .hover\:text-zinc-700:hover,
.ta-modal .hover\:text-zinc-900:hover,
.ta-modal .hover\:text-gray-700:hover,
.ta-modal .hover\:text-gray-900:hover,
.ta-modal .hover\:text-white:hover,
.ta-popover .hover\:text-zinc-700:hover,
.ta-popover .hover\:text-zinc-900:hover,
.ta-popover .hover\:text-gray-700:hover,
.ta-popover .hover\:text-gray-900:hover,
.ta-popover .hover\:text-white:hover,
.ta-pagination .hover\:text-zinc-700:hover,
.ta-pagination .hover\:text-zinc-900:hover,
.ta-pagination .hover\:text-gray-700:hover,
.ta-pagination .hover\:text-gray-900:hover,
.ta-pagination .hover\:text-white:hover {
    color: var(--tp-component-text);
}

.ed-page .group:hover .group-hover\:text-zinc-700,
.ed-page .group:hover .group-hover\:text-zinc-900,
.ed-page .group:hover .group-hover\:text-white,
.ed-surface .group:hover .group-hover\:text-zinc-700,
.ed-surface .group:hover .group-hover\:text-zinc-900,
.ed-surface .group:hover .group-hover\:text-white,
.ta-modal .group:hover .group-hover\:text-zinc-700,
.ta-modal .group:hover .group-hover\:text-zinc-900,
.ta-modal .group:hover .group-hover\:text-white,
.ta-popover .group:hover .group-hover\:text-zinc-700,
.ta-popover .group:hover .group-hover\:text-zinc-900,
.ta-popover .group:hover .group-hover\:text-white,
.ta-pagination .group:hover .group-hover\:text-zinc-700,
.ta-pagination .group:hover .group-hover\:text-zinc-900,
.ta-pagination .group:hover .group-hover\:text-white {
    color: var(--tp-component-text);
}

/* --------------------------------------------------------------------------
   Chips, badges and status
   -------------------------------------------------------------------------- */
.ed-chip,
.badge {
    border: 1px solid var(--tp-component-border);
    border-radius: 999px;
    background: var(--tp-component-surface-subtle);
    color: var(--tp-component-text-muted);
    box-shadow: var(--tp-component-highlight);
}

.ed-chip {
    padding: 4px 10px;
}

.ed-chip:hover {
    border-color: var(--tp-component-border-strong);
    background: var(--tp-component-surface-active);
    color: var(--tp-color-primary-main);
}

.ed-chip--active,
.ed-chip--accent {
    border-color: var(--tp-component-border-strong);
    background: var(--tp-component-surface-active);
    color: var(--tp-color-primary-main);
}

.ed-chip--warn,
.badge-warning {
    border-color: rgb(var(--tp-amber-400) / 0.28);
    background: rgb(var(--tp-amber-400) / 0.09);
    color: var(--tp-color-warning-main);
}

.ed-chip--danger,
.badge-error {
    border-color: rgb(var(--tp-red-400) / 0.28);
    background: rgb(var(--tp-red-500) / 0.09);
    color: var(--tp-color-error-light);
}

.badge-success {
    border-color: rgb(var(--tp-green-400) / 0.28);
    background: rgb(var(--tp-green-400) / 0.09);
    color: var(--tp-color-success-main);
}

.badge-info {
    border-color: rgb(var(--tp-blue-400) / 0.28);
    background: rgb(var(--tp-blue-400) / 0.09);
    color: var(--tp-color-info-main);
}

.ed-chip__dot {
    box-shadow: 0 0 8px currentColor;
}

/* --------------------------------------------------------------------------
   Form controls
   -------------------------------------------------------------------------- */
.ed-input,
.ed-textarea,
.ed-select,
.form-input {
    border-color: var(--tp-component-border);
    border-radius: var(--tp-component-radius-control);
    background-color: var(--tp-component-surface-subtle);
    color: var(--tp-component-text);
    box-shadow: var(--tp-component-highlight);
    transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.ed-input,
.ed-textarea,
.form-input {
    background-image: linear-gradient(105deg, rgb(var(--tp-gray-000) / 0.025), transparent);
}

.ed-input::placeholder,
.ed-textarea::placeholder,
.form-input::placeholder {
    color: var(--tp-component-caption);
}

.ed-input[type="date"],
.form-input[type="date"] {
    color-scheme: var(--tp-color-scheme);
}

.ed-input[type="date"]::-webkit-calendar-picker-indicator,
.form-input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(85%) sepia(6%) saturate(153%) hue-rotate(131deg) brightness(94%) contrast(86%);
    cursor: pointer;
    opacity: 0.9;
}

.ed-input:focus,
.ed-textarea:focus,
.ed-select:focus,
.form-input:focus {
    outline: none;
    border-color: var(--tp-component-focus);
    background-color: var(--tp-component-surface-hover);
    box-shadow: 0 0 0 4px var(--tp-component-focus-soft), var(--tp-component-highlight);
}

.ed-input:disabled,
.ed-textarea:disabled,
.ed-select:disabled,
.form-input:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.ed-select {
    color-scheme: var(--tp-color-scheme);
}

[data-mode="light"] .ed-input[type="date"]::-webkit-calendar-picker-indicator,
[data-theme="light"] .ed-input[type="date"]::-webkit-calendar-picker-indicator,
[data-mode="light"] .form-input[type="date"]::-webkit-calendar-picker-indicator,
[data-theme="light"] .form-input[type="date"]::-webkit-calendar-picker-indicator {
    filter: none;
}

.ed-label,
.form-label {
    color: var(--tp-component-text-muted);
}

.ed-input--error,
.ed-textarea--error,
.ed-select--error {
    border-color: rgb(var(--tp-red-400) / 0.72);
    box-shadow: 0 0 0 4px rgb(var(--tp-red-500) / 0.1);
}

.ed-error,
.form-error {
    color: var(--tp-color-error-light);
}

.ed-switch {
    background: var(--tp-component-surface-hover);
}

.ed-switch::after {
    border-color: var(--tp-component-border);
    background: var(--tp-component-text-muted);
}

input:checked + .ed-switch,
.ed-switch.ed-switch--active {
    background: var(--tp-color-primary-main);
}

input:checked + .ed-switch::after,
.ed-switch.ed-switch--active::after {
    border-color: rgb(var(--tp-gray-000) / 0.38);
    background: var(--tp-color-primary-contrast);
}

/* --------------------------------------------------------------------------
   Buttons and selectable cards
   -------------------------------------------------------------------------- */
.ed-btn,
.btn {
    border-radius: var(--tp-component-radius-control);
    transition: color 160ms ease, border-color 160ms ease, background 160ms ease,
        box-shadow 160ms ease, transform 160ms ease;
}

.ed-btn {
    border-color: var(--tp-component-border);
    background: var(--tp-component-surface-subtle);
    color: var(--tp-component-text);
    box-shadow: none;
}

.ed-btn:hover {
    border-color: var(--tp-component-border-strong);
    background: var(--tp-component-surface-active);
    color: var(--tp-color-primary-main);
}

.ed-btn:focus-visible,
.btn:focus-visible {
    outline: 2px solid var(--tp-component-focus);
    outline-offset: 2px;
    box-shadow: none;
}

.ed-btn:active:not(:disabled),
.btn:active:not(:disabled) {
    transform: translateY(1px);
}

.ed-btn--primary,
.btn-primary {
    border-color: transparent;
    background: linear-gradient(180deg, var(--tp-color-primary-main), var(--tp-color-primary-dark));
    color: var(--tp-color-primary-contrast);
    box-shadow: none;
}

.ed-btn--primary:hover,
.btn-primary:hover {
    border-color: transparent;
    background: linear-gradient(180deg, rgb(var(--tp-endorphin-100)), var(--tp-color-primary-main));
    color: var(--tp-color-primary-contrast);
}

.ed-btn--accent {
    border-color: var(--tp-component-border-strong);
    background: var(--tp-component-surface-active);
    color: var(--tp-color-primary-main);
}

.ed-btn--ghost {
    border-color: transparent;
    background: transparent;
    color: var(--tp-component-text-muted);
    box-shadow: none;
}

.ed-btn--ghost:hover {
    border-color: var(--tp-component-border);
    background: var(--tp-component-surface-hover);
    color: var(--tp-component-text);
}

.ed-btn--elevated,
.ed-btn--elevated:focus-visible {
    box-shadow: var(--tp-component-highlight), 0 8px 22px rgb(var(--tp-endorphin-200) / 0.2);
}

/* Regra global das views: sombra pertence somente à ação Nova conversa. */
.ed-page button {
    box-shadow: none !important;
}

.ed-page button.ed-btn--elevated,
.ed-page button.ed-btn--elevated:focus-visible {
    box-shadow: var(--tp-component-highlight), 0 8px 22px rgb(var(--tp-endorphin-200) / 0.2) !important;
}

.ed-btn--danger,
.btn-danger {
    border-color: rgb(var(--tp-red-400) / 0.3);
    background: rgb(var(--tp-red-500) / 0.1);
    color: var(--tp-color-error-light);
}

.ed-btn--danger:hover,
.btn-danger:hover {
    border-color: rgb(var(--tp-red-400) / 0.52);
    background: rgb(var(--tp-red-500) / 0.16);
    color: rgb(var(--tp-red-200));
}

.ed-btn:disabled,
.btn:disabled {
    opacity: 0.42;
    transform: none;
}

.ed-radio-card {
    border-color: var(--tp-component-border);
    border-radius: var(--tp-component-radius-subcard);
    background: var(--tp-component-surface-subtle);
    box-shadow: var(--tp-component-highlight);
}

.ed-radio-card:hover {
    border-color: var(--tp-component-border-strong);
    background: var(--tp-component-surface-hover);
}

.ed-radio-card--checked {
    border-color: var(--tp-component-border-strong);
    background: var(--tp-component-surface-active);
    box-shadow: 0 0 0 3px var(--tp-component-focus-soft), var(--tp-component-highlight);
}

.ed-radio-card__indicator {
    border-color: var(--tp-component-text-muted);
}

.ed-radio-card--checked .ed-radio-card__indicator {
    border-color: var(--tp-color-primary-main);
}

.ed-radio-card--checked .ed-radio-card__indicator::after {
    background: var(--tp-color-primary-main);
    box-shadow: 0 0 8px rgb(var(--tp-endorphin-200) / 0.45);
}

/* --------------------------------------------------------------------------
   Callouts, empty states and legacy cards
   -------------------------------------------------------------------------- */
.ed-callout {
    border-color: var(--tp-component-border);
    border-left-color: var(--tp-component-text-muted);
    border-radius: var(--tp-component-radius-subcard);
    background: var(--tp-component-surface-subtle);
    color: var(--tp-component-text-muted);
    box-shadow: var(--tp-component-highlight);
}

.ed-callout__title {
    color: var(--tp-component-text);
}

.ed-callout--info {
    border-color: rgb(var(--tp-blue-400) / 0.22);
    border-left-color: var(--tp-color-info-main);
    background: rgb(var(--tp-blue-400) / 0.07);
}

.ed-callout--success {
    border-color: rgb(var(--tp-green-400) / 0.22);
    border-left-color: var(--tp-color-success-main);
    background: rgb(var(--tp-green-400) / 0.07);
    color: var(--tp-component-text-muted);
}

.ed-callout--success .ed-callout__title {
    color: var(--tp-color-success-main);
}

.ed-callout--warn {
    border-color: rgb(var(--tp-amber-400) / 0.22);
    border-left-color: var(--tp-color-warning-main);
    background: rgb(var(--tp-amber-400) / 0.07);
    color: var(--tp-component-text-muted);
}

.ed-callout--warn .ed-callout__title {
    color: var(--tp-color-warning-main);
}

.ed-callout--danger {
    border-color: rgb(var(--tp-red-400) / 0.22);
    border-left-color: var(--tp-color-error-main);
    background: rgb(var(--tp-red-500) / 0.07);
    color: var(--tp-component-text-muted);
}

.ed-callout--danger .ed-callout__title {
    color: var(--tp-color-error-light);
}

.ed-empty {
    color: var(--tp-component-text-muted);
}

.ed-empty__icon {
    color: var(--tp-color-primary-main);
    filter: drop-shadow(0 0 12px rgb(var(--tp-endorphin-200) / 0.22));
}

.agent-card,
.glass-card,
.modal-content {
    border-color: var(--tp-component-border);
    border-radius: var(--tp-component-radius-card);
    background:
        linear-gradient(135deg, rgb(var(--tp-gray-000) / 0.045), rgb(var(--tp-gray-000) / 0.012)),
        var(--tp-component-surface);
    color: var(--tp-component-text);
    box-shadow: var(--tp-component-highlight), var(--tp-component-shadow-card);
    backdrop-filter: blur(var(--tp-blur-glass));
    -webkit-backdrop-filter: blur(var(--tp-blur-glass));
}

.agent-card:hover {
    border-color: var(--tp-component-border-strong);
    box-shadow: var(--tp-component-highlight), 0 18px 42px rgb(var(--tp-gray-999) / 0.38);
}

/* --------------------------------------------------------------------------
   Shared feedback components
   -------------------------------------------------------------------------- */
.ta-modal-backdrop {
    background: var(--tp-component-backdrop);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.ta-modal {
    overflow: hidden;
    border: 1px solid var(--tp-component-border);
    border-radius: var(--tp-component-radius-card);
    background:
        linear-gradient(135deg, rgb(var(--tp-gray-000) / 0.045), transparent 48%),
        var(--tp-component-surface-raised);
    color: var(--tp-component-text);
    box-shadow: var(--tp-component-highlight), var(--tp-component-shadow-overlay);
    backdrop-filter: blur(var(--tp-blur-glass));
    -webkit-backdrop-filter: blur(var(--tp-blur-glass));
}

.ta-modal__title {
    color: var(--tp-component-text);
}

.ta-modal__message,
.ta-modal__loading {
    color: var(--tp-component-text-muted);
}

.ta-modal__close {
    color: var(--tp-component-caption);
}

.ta-modal__close:hover {
    color: var(--tp-component-text);
    background: var(--tp-component-surface-hover);
}

.ta-modal__icon {
    border: 1px solid currentColor;
    background: color-mix(in srgb, currentColor 10%, transparent);
    box-shadow: inset 0 1px rgb(var(--tp-gray-000) / 0.07);
}

.ta-modal__icon--info { color: var(--tp-color-info-main); }
.ta-modal__icon--success { color: var(--tp-color-success-main); }
.ta-modal__icon--error { color: var(--tp-color-error-light); }
.ta-modal__icon--warning { color: var(--tp-color-warning-main); }
.ta-modal__icon--confirm { color: var(--tp-component-text-muted); }

.ta-modal__icon--info svg { color: var(--tp-color-info-main); }
.ta-modal__icon--success svg { color: var(--tp-color-success-main); }
.ta-modal__icon--error svg { color: var(--tp-color-error-light); }
.ta-modal__icon--warning svg { color: var(--tp-color-warning-main); }
.ta-modal__icon--confirm svg { color: var(--tp-component-text-muted); }

.ta-modal__spinner {
    color: var(--tp-color-primary-main);
    filter: drop-shadow(0 0 10px rgb(var(--tp-endorphin-200) / 0.24));
}

.ta-modal__footer {
    border-top: 1px solid var(--tp-component-border-soft);
    background: rgb(var(--tp-gray-999) / 0.2);
}

.ta-modal__action {
    border: 1px solid var(--tp-component-border);
    box-shadow: var(--tp-component-highlight);
}

.ta-modal__action.bg-zinc-900,
.ta-modal__action.bg-emerald-600 {
    border-color: transparent;
    background: linear-gradient(180deg, var(--tp-color-primary-main), var(--tp-color-primary-dark));
    color: var(--tp-color-primary-contrast);
}

.ta-modal__action.bg-white {
    background: var(--tp-component-surface-subtle);
    color: var(--tp-component-text-muted);
}

.ta-modal__action.bg-red-600 {
    border-color: rgb(var(--tp-red-400) / 0.3);
    background: rgb(var(--tp-red-500) / 0.12);
    color: var(--tp-color-error-light);
}

.ta-modal__action:hover {
    border-color: var(--tp-component-border-strong);
    filter: brightness(1.08);
}

.ta-toast {
    border: 1px solid var(--tp-component-border);
    border-radius: var(--tp-component-radius-subcard);
    background: var(--tp-component-surface-raised) !important;
    color: var(--tp-component-text) !important;
    box-shadow: var(--tp-component-highlight), var(--tp-component-shadow-overlay);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.ta-toast.bg-green-600 { border-color: rgb(var(--tp-green-400) / 0.34); }
.ta-toast.bg-green-600 > div:first-of-type { color: var(--tp-color-success-main); }
.ta-toast.bg-red-600 { border-color: rgb(var(--tp-red-400) / 0.34); }
.ta-toast.bg-red-600 > div:first-of-type { color: var(--tp-color-error-light); }
.ta-toast.bg-yellow-500 { border-color: rgb(var(--tp-amber-400) / 0.34); }
.ta-toast.bg-yellow-500 > div:first-of-type { color: var(--tp-color-warning-main); }
.ta-toast.bg-blue-600 { border-color: rgb(var(--tp-blue-400) / 0.34); }
.ta-toast.bg-blue-600 > div:first-of-type { color: var(--tp-color-info-main); }

.ta-loading-overlay {
    border-radius: var(--tp-component-radius-subcard);
    background: rgb(var(--tp-gray-940) / 0.86);
    color: var(--tp-component-text-muted);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.ta-loading-card,
.ta-skeleton-card,
.ta-pagination {
    border: 1px solid var(--tp-component-border);
    border-radius: var(--tp-component-radius-subcard);
    background: var(--tp-component-surface-subtle);
    color: var(--tp-component-text-muted);
    box-shadow: var(--tp-component-highlight);
}

.ta-pagination {
    border-radius: 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
}

.ta-pagination-compact {
    border-color: var(--tp-component-border-soft);
}

.ta-pagination-compact__summary {
    color: var(--tp-component-text-muted);
}

.ta-pagination-compact__summary .font-medium,
.ta-pagination-compact__current {
    color: var(--tp-component-text);
}

.ta-pagination-compact__current {
    border-color: var(--tp-component-border);
}

.ta-pagination-compact__controls {
    overflow: hidden;
    border: 1px solid var(--tp-component-border);
    border-radius: var(--tp-component-radius-control);
    background: var(--tp-component-surface-subtle);
    box-shadow: var(--tp-component-highlight);
}

.ta-pagination-compact__button {
    color: var(--tp-component-text-muted);
}

.ta-pagination-compact__button:hover:not(:disabled) {
    color: var(--tp-component-text);
    background: var(--tp-component-surface-hover);
}

.ta-pagination-compact__button:disabled {
    opacity: 0.4;
}

.ta-pagination-compact__divider {
    color: var(--tp-component-caption);
}

.ta-language-switcher__trigger,
.ta-language-switcher__option {
    color: var(--tp-component-text-muted);
}

.ta-language-switcher__icon,
.ta-language-switcher__code {
    color: var(--tp-component-caption);
}

.ta-language-switcher__trigger:hover,
.ta-language-switcher__trigger:focus-visible,
.ta-language-switcher__option:hover,
.ta-language-switcher__option:focus-visible,
.ta-language-switcher__option.is-active {
    color: var(--tp-component-text);
    background: var(--tp-component-surface-hover);
}

.ta-language-switcher__popover {
    border: 1px solid var(--tp-component-border);
    background: var(--tp-component-surface-raised);
    box-shadow: var(--tp-component-highlight), var(--tp-component-shadow-overlay);
    backdrop-filter: blur(var(--tp-blur-glass));
    -webkit-backdrop-filter: blur(var(--tp-blur-glass));
}

.ta-inline-language-menu {
    border-color: var(--tp-component-border-soft);
}

.ta-inline-language-menu__trigger,
.ta-inline-language-menu__option {
    color: var(--tp-component-text-muted);
}

.ta-inline-language-menu__icon,
.ta-inline-language-menu__code {
    color: var(--tp-component-caption);
}

.ta-inline-language-menu__trigger:hover,
.ta-inline-language-menu__trigger:focus-visible,
.ta-inline-language-menu__option:hover,
.ta-inline-language-menu__option:focus-visible,
.ta-inline-language-menu__option.is-active {
    color: var(--tp-component-text);
    background: var(--tp-component-surface-hover);
}

.ta-inline-language-menu__panel {
    background: rgb(var(--tp-gray-000) / 0.025);
}

.ta-bulk-toolbar {
    border: 1px solid var(--tp-component-border);
    border-radius: var(--tp-component-radius-card);
    background: var(--tp-component-surface-raised);
    color: var(--tp-component-text);
    box-shadow: var(--tp-component-highlight), var(--tp-component-shadow-overlay);
    backdrop-filter: blur(var(--tp-blur-glass));
    -webkit-backdrop-filter: blur(var(--tp-blur-glass));
}

.ta-bulk-toolbar__count {
    color: var(--tp-component-text);
}

.ta-bulk-toolbar__divider {
    background: var(--tp-component-border-soft);
}

.ta-bulk-toolbar__action {
    border: 1px solid var(--tp-component-border);
    border-radius: var(--tp-component-radius-control);
    background: var(--tp-component-surface-subtle);
    color: var(--tp-component-text);
    box-shadow: var(--tp-component-highlight);
}

.ta-bulk-toolbar__action:hover,
.ta-bulk-toolbar__action:focus-visible,
.ta-bulk-toolbar__ghost:hover,
.ta-bulk-toolbar__ghost:focus-visible,
.ta-bulk-toolbar__menu-item:hover,
.ta-bulk-toolbar__menu-item:focus-visible {
    background: var(--tp-component-surface-hover);
}

.ta-bulk-toolbar__ghost,
.ta-bulk-toolbar__menu-item {
    color: var(--tp-component-text-muted);
}

.ta-bulk-toolbar__ghost:hover,
.ta-bulk-toolbar__ghost:focus-visible,
.ta-bulk-toolbar__menu-item:hover,
.ta-bulk-toolbar__menu-item:focus-visible {
    color: var(--tp-component-text);
}

.ta-bulk-toolbar__menu-icon {
    color: var(--tp-component-caption);
}

.ta-folder-breadcrumbs {
    color: var(--tp-component-text-muted);
}

.ta-folder-breadcrumbs__link {
    color: inherit;
}

.ta-folder-breadcrumbs__link:hover,
.ta-folder-breadcrumbs__link:focus-visible {
    color: var(--tp-component-text);
}

.ta-folder-breadcrumbs__separator {
    color: var(--tp-component-border-strong);
}

.ta-folder-breadcrumbs__current {
    color: var(--tp-component-text);
}

.ta-tag-filter__label,
.ta-tag-filter__clear {
    color: var(--tp-component-caption);
}

.ta-tag-filter__clear:hover,
.ta-tag-filter__clear:focus-visible {
    color: var(--tp-component-text);
}

.ta-folder-sidebar__toggle,
.ta-folder-sidebar__title,
.ta-folder-sidebar__icon-button,
.ta-folder-sidebar__item,
.ta-folder-sidebar__action,
.ta-tag-editor__remove,
.ta-tag-editor__suggestion {
    color: var(--tp-component-text-muted);
}

.ta-folder-sidebar__toggle:hover,
.ta-folder-sidebar__toggle:focus-visible,
.ta-folder-sidebar__icon-button:hover,
.ta-folder-sidebar__icon-button:focus-visible,
.ta-folder-sidebar__action:hover,
.ta-folder-sidebar__action:focus-visible,
.ta-tag-editor__remove:hover,
.ta-tag-editor__remove:focus-visible,
.ta-tag-editor__suggestion:hover,
.ta-tag-editor__suggestion:focus-visible {
    color: var(--tp-component-text);
}

.ta-folder-sidebar__header,
.ta-folder-sidebar__divider {
    border-color: var(--tp-component-border);
}

.ta-folder-sidebar__item {
    color: var(--tp-component-text-muted);
}

.ta-folder-sidebar__item:hover,
.ta-folder-sidebar__item:focus-visible,
.ta-folder-sidebar__item.is-active {
    background: var(--tp-component-surface-hover);
    color: var(--tp-component-text);
}

.ta-folder-sidebar__item.is-active {
    border-left: 2px solid var(--tp-component-text);
    margin-left: -1px;
    padding-left: 10px;
}

.ta-folder-sidebar__item--child.is-active {
    margin-left: 0;
    padding-left: 0.75rem;
}

.ta-folder-sidebar__item-icon,
.ta-folder-sidebar__count {
    color: var(--tp-component-caption);
}

.ta-folder-sidebar__action--share:hover,
.ta-folder-sidebar__action--share:focus-visible {
    color: var(--tp-color-info-main);
}

.ta-folder-sidebar__action--danger:hover,
.ta-folder-sidebar__action--danger:focus-visible {
    color: var(--tp-color-error-light);
}

.ta-folder-sidebar__modal-copy,
.ta-folder-sidebar__modal-label {
    color: var(--tp-component-text-muted);
}

.ta-folder-sidebar__modal-note {
    color: var(--tp-component-caption);
}

.ta-folder-sidebar__color-input {
    border: 1px solid var(--tp-component-border);
    background: var(--tp-component-surface-subtle);
    box-shadow: var(--tp-component-highlight);
}

.ta-folder-sidebar__modal-alert {
    border: 1px solid var(--tp-component-border);
    background: var(--tp-component-surface-subtle);
}

.ta-folder-sidebar__modal-alert--danger {
    border-color: rgb(var(--tp-red-500) / 0.24);
    background: rgb(var(--tp-red-500) / 0.08);
}

.ta-folder-sidebar__modal-alert--info {
    border-color: rgb(var(--tp-blue-400) / 0.24);
    background: rgb(var(--tp-blue-400) / 0.08);
}

.ta-folder-sidebar__modal-alert-title {
    color: var(--tp-component-text);
}

.ta-folder-sidebar__modal-alert--danger .ta-folder-sidebar__modal-alert-title,
.ta-folder-sidebar__modal-alert--danger .ta-folder-sidebar__modal-alert-copy {
    color: var(--tp-color-error-light);
}

.ta-folder-sidebar__modal-alert--info .ta-folder-sidebar__modal-alert-title,
.ta-folder-sidebar__modal-alert--info .ta-folder-sidebar__modal-alert-copy {
    color: var(--tp-color-info-main);
}

.ta-workflow-panel__header,
.ta-workflow-side-panel__header {
    border-color: var(--tp-component-border);
}

.ta-workflow-panel__title,
.ta-workflow-side-panel__title,
.ta-workflow-side-panel__label {
    color: var(--tp-component-text);
}

.ta-workflow-panel__subtitle,
.ta-workflow-side-panel__eyebrow,
.ta-workflow-panel__loading-icon,
.ta-workflow-panel__retry,
.ta-workflow-side-panel__close {
    color: var(--tp-component-text-muted);
}

.ta-workflow-panel__toolbar,
.ta-workflow-panel__canvas {
    background: var(--tp-component-surface-subtle);
}

.ta-workflow-panel__toolbar-btn {
    color: var(--tp-component-text-muted);
}

.ta-workflow-panel__toolbar-btn:hover,
.ta-workflow-panel__toolbar-btn:focus-visible,
.ta-workflow-panel__retry:hover,
.ta-workflow-panel__retry:focus-visible,
.ta-workflow-side-panel__close:hover,
.ta-workflow-side-panel__close:focus-visible {
    color: var(--tp-component-text);
    background: var(--tp-component-surface-hover);
}

.ta-workflow-panel__error {
    color: var(--tp-color-error-light);
}

.ta-workflow-side-panel__handle {
    background: var(--tp-component-border-strong);
}

.ta-workflow-side-panel__warning {
    border-color: rgb(var(--tp-amber-400) / 0.22);
    background: rgb(var(--tp-amber-400) / 0.08);
    color: var(--tp-color-warning-main);
}

.ta-workflow-side-panel__check,
.ta-workflow-side-panel__check-label {
    color: var(--tp-component-text);
    border-color: var(--tp-component-border);
}

.ta-workflow-side-panel__footer {
    border-color: var(--tp-component-border);
    background: var(--tp-component-surface-subtle);
}

.ta-playground-media__file {
    border: 1px solid var(--tp-component-border);
    background: var(--tp-component-surface-subtle);
}

.ta-playground-media__thumb {
    border: 1px solid var(--tp-component-border);
}

.ta-playground-media__audio {
    background: rgb(var(--tp-violet-400) / 0.14);
}

.ta-playground-media__audio-icon {
    color: rgb(var(--tp-violet-400));
}

.ta-playground-media__doc {
    background: var(--tp-component-surface-hover);
}

.ta-playground-media__doc-icon,
.ta-playground-media__name {
    color: var(--tp-component-text);
}

.ta-playground-media__meta,
.ta-playground-media__action,
.ta-playground-media__remove {
    color: var(--tp-component-text-muted);
}

.ta-playground-media__remove:hover,
.ta-playground-media__remove:focus-visible {
    color: var(--tp-color-error-light);
    background: rgb(var(--tp-red-500) / 0.08);
}

.ta-playground-media__recording {
    border: 1px solid rgb(var(--tp-red-500) / 0.22);
    background: rgb(var(--tp-red-500) / 0.08);
}

.ta-playground-media__recording-dot,
.ta-playground-media__recording-time,
.ta-playground-media__bar {
    background: rgb(var(--tp-red-400));
    color: rgb(var(--tp-red-400));
}

.ta-playground-media__recording-label {
    color: var(--tp-color-error-light);
}

.ta-playground-media__recording-stop {
    background: rgb(var(--tp-red-500));
    color: rgb(var(--tp-gray-000));
}

.ta-playground-media__recording-stop:hover,
.ta-playground-media__recording-stop:focus-visible {
    background: rgb(var(--tp-red-400));
}

.ta-playground-media__action:hover,
.ta-playground-media__action:focus-visible,
.ta-playground-media__action.is-recording {
    color: var(--tp-component-text);
    background: var(--tp-component-surface-hover);
}

.ta-playground-media__action.is-recording {
    color: var(--tp-color-error-light);
    background: rgb(var(--tp-red-500) / 0.08);
}

.ta-builder-tabs,
.ta-builder-mode-toggle {
    background: var(--tp-component-surface-subtle);
}

.ta-builder-tabs__button,
.ta-builder-mode-toggle__button {
    color: var(--tp-component-text-muted);
}

.ta-builder-tabs__button:hover,
.ta-builder-tabs__button:focus-visible,
.ta-builder-mode-toggle__button:hover,
.ta-builder-mode-toggle__button:focus-visible,
.ta-builder-tabs__button.is-active,
.ta-builder-mode-toggle__button.is-active {
    color: var(--tp-component-text);
}

.ta-builder-tabs__button.is-active,
.ta-builder-mode-toggle__button.is-active {
    background: var(--tp-component-surface);
}

.ta-builder-chat__icon {
    background: var(--tp-component-text);
}

.ta-builder-chat__icon-svg {
    color: var(--tp-component-surface);
}

.ta-builder-chat__title,
.ta-builder-chat__assistant-message,
.ta-builder-chat__user-message {
    color: var(--tp-component-text);
}

.ta-builder-chat__subtitle {
    color: var(--tp-component-text-muted);
}

.ta-builder-chat__user-message {
    background: var(--tp-component-text);
    color: var(--tp-component-surface);
}

.ta-builder-chat__assistant-message,
.ta-builder-chat__cursor {
    background: var(--tp-component-surface-subtle);
}

.ta-builder-chat__status-icon,
.ta-builder-chat__status-label {
    color: var(--tp-component-text);
}

.ta-builder-chat__kbd {
    border: 1px solid var(--tp-component-border-soft);
    background: var(--tp-component-surface-subtle);
    color: var(--tp-component-text-muted);
}

.ta-builder-chat__send {
    background: var(--tp-component-text);
    color: var(--tp-component-surface);
}

.ta-builder-chat__send:hover:not(:disabled),
.ta-builder-chat__send:focus-visible:not(:disabled) {
    background: var(--tp-component-text-muted);
}

.ta-builder-chat__send:disabled {
    background: var(--tp-component-border-strong);
    color: var(--tp-component-caption);
}

.ta-onboarding-progress__step {
    background: var(--tp-component-border);
}

.ta-onboarding-progress__step--active {
    background: rgb(var(--tp-green-400));
}

.ta-onboarding-card {
    border: 1px solid var(--tp-component-border);
    background: var(--tp-component-surface);
}

.ta-onboarding-card:hover {
    border-color: var(--tp-component-border-strong);
}

.ta-onboarding-card--active {
    border-color: rgb(var(--tp-green-400) / 0.45);
}

.ta-onboarding-card__index {
    border: 1px solid var(--tp-component-border-strong);
    background: var(--tp-component-surface-subtle);
    color: var(--tp-component-text-muted);
}

.ta-onboarding-card__index--active {
    border-color: rgb(var(--tp-green-400));
    background: rgb(var(--tp-green-400) / 0.1);
    color: rgb(var(--tp-green-400));
}

.ta-onboarding-card__title {
    color: var(--tp-component-text);
}

.ta-onboarding-card__copy,
.ta-onboarding-card__chevron,
.ta-onboarding-resource__icon-svg {
    color: var(--tp-component-text-muted);
}

.ta-onboarding-card__chevron--active,
.ta-onboarding-card:hover .ta-onboarding-card__chevron--active {
    color: rgb(var(--tp-green-400));
}

.ta-onboarding-card:hover .ta-onboarding-card__chevron,
.ta-onboarding-resource:hover .ta-onboarding-resource__icon-svg,
.ta-onboarding-card:hover .ta-onboarding-card__title {
    color: var(--tp-component-text);
}

.ta-onboarding-resource__icon {
    border: 1px solid var(--tp-component-border);
    background: var(--tp-component-surface-subtle);
}

.ta-onboarding-resource:hover .ta-onboarding-resource__icon {
    background: var(--tp-component-surface-hover);
}

[data-mode="light"] .ta-builder-chat__icon,
[data-mode="light"] .ta-builder-chat__user-message,
[data-mode="light"] .ta-builder-chat__send,
[data-theme="light"] .ta-builder-chat__icon,
[data-theme="light"] .ta-builder-chat__user-message,
[data-theme="light"] .ta-builder-chat__send {
    background: rgb(var(--tp-gray-999) / 0.92);
}

[data-mode="light"] .ta-builder-chat__icon-svg,
[data-mode="light"] .ta-builder-chat__user-message,
[data-mode="light"] .ta-builder-chat__send,
[data-theme="light"] .ta-builder-chat__icon-svg,
[data-theme="light"] .ta-builder-chat__user-message,
[data-theme="light"] .ta-builder-chat__send {
    color: rgb(var(--tp-gray-000));
}

.ta-tag {
    border: 1px solid var(--tp-component-border);
    border-radius: 999px;
    background: var(--tp-component-surface-subtle);
    color: var(--tp-component-text);
    box-shadow: var(--tp-component-highlight);
}

.ta-tag button {
    color: var(--tp-component-caption);
}

.ta-tag button:hover {
    color: var(--tp-color-primary-main);
}

@media (max-width: 640px) {
    .ed-page,
    .ed-surface {
        border-radius: var(--tp-component-radius-subcard);
    }

    .ta-toast {
        min-width: min(300px, calc(100vw - 2rem));
        max-width: calc(100vw - 2rem);
    }
}

@media (prefers-reduced-motion: reduce) {
    .ed-row,
    .ed-chip,
    .ed-btn,
    .btn,
    .ed-input,
    .ed-textarea,
    .ed-select,
    .ed-radio-card,
    .ta-toast,
    .ta-modal {
        transition: none !important;
        animation: none !important;
    }
}

/* --------------------------------------------------------------------------
   Workflows: blocos de codigo/erro, estados de linha e utilitarios
   (alpha-variants do Tailwind ficam fora do remap dark — tokens diretos aqui)
   -------------------------------------------------------------------------- */
.wf-code {
    background: var(--tp-component-surface-subtle);
    border: 1px solid var(--tp-component-border);
    border-radius: 8px;
    color: var(--tp-component-text-muted);
    padding: 8px 12px;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-word;
}

.wf-code--error {
    background: rgb(var(--tp-red-500) / 0.08);
    border-color: rgb(var(--tp-red-400) / 0.25);
    color: var(--tp-color-error-light);
}

.ed-row--selected {
    background: rgb(var(--tp-green-400) / 0.08);
}

/* hover:text-red-* perde a cascata para .ed-btn--ghost:hover — classe propria */
.ed-btn.ed-danger-hover:hover {
    color: var(--tp-color-error-light);
}

.ed-page input[type="checkbox"]:not(.sr-only) {
    accent-color: var(--tp-color-primary-main);
}

.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.scrollbar-hide::-webkit-scrollbar {
    display: none;
}

/* Resultado de execucao de workflow: texto corrido e tabela chave/valor */
.wf-result-text {
    white-space: pre-wrap;
    word-break: break-word;
    color: var(--tp-component-text);
    background: var(--tp-component-surface-subtle);
    border: 1px solid var(--tp-component-border);
    border-radius: 8px;
    padding: 10px 12px;
}

.wf-kv {
    border: 1px solid var(--tp-component-border);
    border-radius: 8px;
    overflow: hidden;
}

.wf-kv__row {
    display: grid;
    grid-template-columns: minmax(90px, 180px) 1fr;
    gap: 12px;
    padding: 6px 12px;
}

.wf-kv__row + .wf-kv__row {
    border-top: 1px solid var(--tp-component-border);
}

.wf-kv__row dt {
    font-family: var(--tp-font-mono, ui-monospace, monospace);
    font-size: 11px;
    color: var(--tp-component-text-muted);
    overflow-wrap: anywhere;
    align-self: center;
}

.wf-kv__row dd {
    font-size: 13px;
    color: var(--tp-component-text);
    overflow-wrap: anywhere;
}

/* .ed-input{width:100%} (style.css) empata em especificidade com .w-auto do
   Tailwind e vence pela ordem de carga — o select "Todos os status" estourava
   para 100% e colapsava o input de busca ao lado. Compound = 0,2,0, vence. */
.ed-input.w-auto,
.ed-select.w-auto,
.ed-textarea.w-auto {
    width: auto;
}