/* Componentes compartidos. Sin dependencias de Bootstrap ni del HTML anterior. */
@font-face { font-family: TeloV2Inter; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/telo-v2/Inter-Regular.ttf') format('truetype'); }
@font-face { font-family: TeloV2Inter; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/telo-v2/Inter-Medium.ttf') format('truetype'); }
@font-face { font-family: TeloV2Inter; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/telo-v2/Inter-SemiBold.ttf') format('truetype'); }
@font-face { font-family: TeloV2Inter; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/telo-v2/Inter-Bold.ttf') format('truetype'); }
.tv2-ui { color: var(--tv2-ink); font: var(--tv2-weight-normal) var(--tv2-text-body)/var(--tv2-leading) var(--tv2-font); -webkit-font-smoothing: antialiased; }
.tv2-ui *, .tv2-ui *::before, .tv2-ui *::after { box-sizing: border-box; }
.tv2-ui [hidden] { display: none !important; }
.tv2-ui h1, .tv2-ui h2, .tv2-ui h3, .tv2-ui p { margin: 0; font-family: inherit; color: inherit; }
.tv2-ui h1 { font-size: var(--tv2-text-title); font-weight: var(--tv2-weight-semibold); line-height: var(--tv2-leading-tight); letter-spacing: -.045em; }
.tv2-ui h2 { font-size: var(--tv2-text-lg); font-weight: var(--tv2-weight-semibold); line-height: var(--tv2-leading); letter-spacing: -.025em; }
.tv2-ui h3 { font-size: var(--tv2-text-body); font-weight: var(--tv2-weight-semibold); }
.tv2-ui a { color: inherit; text-decoration: none; }
.tv2-ui button, .tv2-ui input, .tv2-ui select { font: inherit; }
.tv2-ui button { cursor: pointer; }
.tv2-ui button:disabled { cursor: wait; opacity: .55; }
.tv2-ui :focus-visible { outline: 2px solid var(--tv2-brand); outline-offset: 3px; }
.tv2-icon { display: block; width: var(--tv2-icon); height: var(--tv2-icon); flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; vertical-align: middle; }
.tv2-icon--small { width: var(--tv2-icon-small); height: var(--tv2-icon-small); }
/* Contrato central: todo icono decorativo dentro de un contenedor conserva su centro geométrico, incluso si una vista aplica reglas amplias a span o i. */
.tv2-ui .tv2-icon-frame { display: inline-grid; place-items: center; align-items: center; justify-content: center; flex: 0 0 auto; line-height: 0; }
.tv2-ui .tv2-icon-frame > :is(.tv2-icon,i) { display: grid; place-items: center; grid-area: 1 / 1; margin: 0; max-width: 100%; max-height: 100%; }
.tv2-ui .tv2-icon-frame > i { width: 1em; height: 1em; line-height: 1; text-align: center; }
.tv2-ui .tv2-icon-frame > i::before { display: block; line-height: 1; }
.tv2-muted { color: var(--tv2-muted); }
.tv2-ui .tv2-caption { font-size: var(--tv2-text-sm); color: var(--tv2-muted); }
/* Compatibilidad global para superficies V2 existentes que aún no usan el agrupador explícito. */
.tv2-ui :is(strong,.tv2-label,.tv2-comm-table__primary) + :is(.tv2-caption,small) { display: block; margin-top: var(--tv2-space-1); font-weight: var(--tv2-weight-normal); line-height: var(--tv2-leading); overflow-wrap: anywhere; }
/* Contrato central para una etiqueta principal y su ayuda: nunca deben quedar pegadas ni depender de espacios en el HTML. */
.tv2-ui .tv2-label-stack { display: grid; grid-template-columns: minmax(0,1fr); align-content: start; justify-items: start; gap: var(--tv2-space-1); min-width: 0; }
.tv2-ui .tv2-label-stack > :is(strong,.tv2-label,.tv2-caption,small) { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.tv2-ui .tv2-label-stack > :is(.tv2-caption,small) { display: block; margin: 0; color: var(--tv2-muted); font-size: var(--tv2-text-sm); font-weight: var(--tv2-weight-normal); line-height: var(--tv2-leading); }
.tv2-ui .tv2-eyebrow { font-size: var(--tv2-text-xs); color: var(--tv2-muted); letter-spacing: .1em; text-transform: uppercase; font-weight: var(--tv2-weight-medium); }
.tv2-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.tv2-button, .tv2-ui a.tv2-button {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--tv2-space-2); min-height: var(--tv2-control);
  padding: var(--tv2-space-2) var(--tv2-space-4); border: 1px solid var(--tv2-border); border-radius: var(--tv2-radius-pill);
  color: var(--tv2-ink); background: var(--tv2-white); font-size: var(--tv2-text-sm); font-weight: var(--tv2-weight-medium); line-height: var(--tv2-leading);
  white-space: nowrap; transition: background var(--tv2-motion-fast), box-shadow var(--tv2-motion-fast), transform var(--tv2-motion-fast);
}
.tv2-ui button.tv2-button { font-size: var(--tv2-text-sm); font-weight: var(--tv2-weight-medium); line-height: var(--tv2-leading); }
.tv2-button:hover { background: var(--tv2-surface-soft); box-shadow: var(--tv2-shadow); }
.tv2-button:active { transform: scale(.98); }
.tv2-button--primary, .tv2-ui a.tv2-button--primary { background: var(--tv2-brand); color: var(--tv2-white); border-color: var(--tv2-brand); box-shadow: var(--tv2-shadow-button); }
.tv2-button--primary:hover { background: var(--tv2-brand-hover); }
.tv2-button--quiet { border-color: transparent; background: transparent; }
.tv2-ui .tv2-button.tv2-button--square { padding: 0; width: var(--tv2-control); height: var(--tv2-control); min-height: var(--tv2-control); flex: 0 0 var(--tv2-control); box-sizing: border-box; }
.tv2-ui :is(.tv2-button,.tv2-badge,.tv2-notice,.tv2-segments button,.tv2-segments a[href]) > i { display: inline-grid; place-items: center; width: 1em; height: 1em; flex: 0 0 auto; margin: 0; line-height: 1; text-align: center; }
.tv2-ui :is(.tv2-button,.tv2-badge,.tv2-notice,.tv2-segments button,.tv2-segments a[href]) > i::before { display: block; line-height: 1; }
.tv2-badge { display: inline-flex; align-items: center; gap: var(--tv2-space-1); padding: var(--tv2-space-1) var(--tv2-space-2); color: var(--tv2-brand-ink); background: var(--tv2-mint); border-radius: var(--tv2-radius-sm); font-size: var(--tv2-text-xs); font-weight: var(--tv2-weight-medium); white-space: nowrap; }
.tv2-badge--warning { color: var(--tv2-warning); background: var(--tv2-warning-soft); }
.tv2-badge--danger { color: var(--tv2-danger); background: var(--tv2-danger-soft); }
.tv2-card, .tv2-metric { background: var(--tv2-surface); border: 1px solid var(--tv2-white); border-radius: var(--tv2-radius-card); padding: var(--tv2-card-pad-block) var(--tv2-space-5); box-shadow: var(--tv2-shadow); min-width: 0; }
.tv2-card__header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--tv2-space-3); margin-bottom: var(--tv2-space-4); }
.tv2-card__header .tv2-caption { display: block; margin-top: var(--tv2-space-1); }
.tv2-segments { display: inline-flex; align-items: center; gap: var(--tv2-space-1); border-radius: var(--tv2-radius-pill); background: var(--tv2-mint); padding: var(--tv2-space-1); position: relative; max-width: 100%; }
/* Las barras construidas como ul/ol conservan el radio a través del li intermedio. */
.tv2-segments:is(ul,ol) { list-style: none; margin: 0; }
.tv2-segments > li { border-radius: inherit; }
.tv2-segments :is(button,a[href]) { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: var(--tv2-space-2); background: transparent; border: 0; border-radius: inherit; min-height: 32px; padding: var(--tv2-space-1) var(--tv2-space-4); color: var(--tv2-muted); font-size: var(--tv2-text-sm); font-weight: var(--tv2-weight-medium); white-space: nowrap; transition: color var(--tv2-motion-fast), background var(--tv2-motion); }
.tv2-segments :is(button[aria-selected="true"],button[aria-pressed="true"],a[aria-current="page"]) { background: var(--tv2-ink); color: var(--tv2-white); }
.tv2-segments[role="tablist"][data-tv2-ready] { display: inline-grid; grid-auto-flow: column; grid-auto-columns: 1fr; }
.tv2-segments[role="tablist"][data-tv2-ready]::before { content: ""; position: absolute; left: var(--tv2-space-1); top: var(--tv2-space-1); bottom: var(--tv2-space-1); width: calc((100% - var(--tv2-space-2) - (var(--tv2-tab-count) - 1) * var(--tv2-space-1)) / var(--tv2-tab-count)); border-radius: inherit; background: var(--tv2-ink); transform: translateX(calc(var(--tv2-tab-index) * (100% + var(--tv2-space-1)))); transition: transform var(--tv2-motion) var(--tv2-ease); }
.tv2-segments[role="tablist"][data-tv2-ready] button[aria-selected="true"] { background: transparent; }
.tv2-segments--soft { background: var(--tv2-surface-soft); }
.tv2-ui .tv2-segments--soft:not([role="tablist"]) { flex-wrap:wrap; }
.tv2-segments--soft :is(button[aria-pressed="true"],a[aria-current="page"]) { background: var(--tv2-brand); }
/* Long tab sets wrap on compact screens; every option stays visible and keyboard accessible. */
@media (max-width: 600px) {
  .tv2-segments[role="tablist"][data-tv2-ready] { display: flex; flex-wrap: wrap; width: fit-content; border-radius: var(--tv2-radius-control); }
  .tv2-segments[role="tablist"][data-tv2-ready]::before { display: none; }
  .tv2-segments[role="tablist"][data-tv2-ready] button[aria-selected="true"] { background: var(--tv2-ink); }
}
.tv2-tab-panel.is-entering { animation: tv2-enter var(--tv2-motion-reveal) var(--tv2-ease) both; }
.tv2-field { display: flex; flex-direction: column; gap: var(--tv2-space-2); min-width: 0; font-weight: var(--tv2-weight-medium); font-size: var(--tv2-text-sm); }
.tv2-input, .tv2-ui .tv2-search > input { box-sizing: border-box; width: 100%; min-width: 0; min-height: var(--tv2-control); padding: var(--tv2-space-2) var(--tv2-space-3); border: 1px solid var(--tv2-border); border-radius: var(--tv2-radius-control); background: var(--tv2-surface-soft); box-shadow: none; color: var(--tv2-ink); font: inherit; transition: border-color var(--tv2-motion-fast), background var(--tv2-motion-fast); }
.tv2-input:focus, .tv2-ui .tv2-search > input:focus { border-color: var(--tv2-brand); background: var(--tv2-white); }
.tv2-search { position: relative; display: flex; align-items: center; width: 100%; min-width: 0; }
.tv2-search > :is(.tv2-icon, i[aria-hidden="true"]) { position: absolute; left: var(--tv2-space-3); z-index: 1; color: var(--tv2-muted); pointer-events: none; }
.tv2-ui .tv2-search > input { padding-left: var(--tv2-space-10); }
.tv2-dialog { box-sizing:border-box; border: 1px solid var(--tv2-white); border-radius: var(--tv2-radius-lg); background: var(--tv2-surface); color: var(--tv2-ink); padding: var(--tv2-space-6); width: min(740px, calc(100vw - 32px)); max-height: calc(100dvh - 48px); overflow: auto; box-shadow: var(--tv2-shadow-float); margin: auto; }
.tv2-dialog[open] { animation: tv2-enter var(--tv2-motion) var(--tv2-ease); }
.tv2-dialog::backdrop { background: var(--tv2-overlay); backdrop-filter: blur(5px); }
.tv2-dialog__header, .tv2-dialog__footer { display: flex; justify-content: space-between; align-items: center; gap: var(--tv2-space-3); }
.tv2-dialog__header { margin-bottom: var(--tv2-space-5); }
.tv2-dialog__footer { margin-top: var(--tv2-space-5); padding-top: var(--tv2-space-4); border-top: 1px solid var(--tv2-border); }
.tv2-dialog__footer > :last-child { margin-left: auto; }
.tv2-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--tv2-space-4); }
.tv2-check-list { max-height: 190px; overflow: auto; padding: var(--tv2-space-2) 0; }
.tv2-check { display: flex; align-items: center; gap: var(--tv2-space-2); padding: var(--tv2-space-2); border-radius: var(--tv2-radius-sm); font-size: var(--tv2-text-md); font-weight: var(--tv2-weight-normal); cursor: pointer; margin: 0; }
.tv2-check:hover { background: var(--tv2-mint); }
.tv2-check input { margin: 0; accent-color: var(--tv2-brand); width: 16px; height: 16px; }
.tv2-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: var(--tv2-space-2); min-height: 160px; padding: var(--tv2-space-6); color: var(--tv2-muted); }
.tv2-empty > .tv2-icon { width: 28px; height: 28px; color: var(--tv2-brand); }
.tv2-notice { display: flex; flex-wrap: wrap; align-items: center; gap: var(--tv2-space-2); min-width: 0; overflow-wrap: anywhere; padding: var(--tv2-space-3) var(--tv2-space-4); background: var(--tv2-mint); color: var(--tv2-brand-ink); border-radius: var(--tv2-radius-control); font-size: var(--tv2-text-sm); }
.tv2-notice--error { background: var(--tv2-danger-soft); color: var(--tv2-danger); }
.tv2-table-scroll { position: relative; max-width: 100%; overflow: auto; }
.tv2-table { width: 100%; border-collapse: collapse; text-align: left; font-size: var(--tv2-text-md); }
.tv2-table th { font-weight: var(--tv2-weight-medium); font-size: var(--tv2-text-xs); color: var(--tv2-muted); background: var(--tv2-surface-soft); }
.tv2-table td, .tv2-table th { padding: var(--tv2-space-3) var(--tv2-space-4); border-bottom: 1px solid var(--tv2-border); vertical-align: middle; text-align: inherit; }
/* El resaltado pertenece a la fila completa, incluidas celdas con bandas propias. */
.tv2-ui .tv2-table > tbody > tr:hover,
.tv2-ui .tv2-table > tbody > tr:hover > :is(td,th) { background: var(--tv2-table-row-hover); }
.tv2-table th.tv2-numeric, .tv2-table td.tv2-numeric { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tv2-table th button { background: transparent; border: 0; color: inherit; padding: 0; text-align: inherit; }
.tv2-pagination { display: flex; justify-content: space-between; align-items: center; gap: var(--tv2-space-3); margin-top: var(--tv2-space-4); }
.tv2-pagination__actions { display: flex; gap: var(--tv2-space-2); }
.tv2-progress { height: 5px; background: var(--tv2-mint); border-radius: var(--tv2-radius-pill); overflow: hidden; }
.tv2-progress > span { display: block; height: 100%; width: var(--tv2-value, 0%); background: var(--tv2-brand); border-radius: inherit; animation: tv2-grow var(--tv2-motion-reveal) var(--tv2-ease) both; transform-origin: left; }
.tv2-loader { width: var(--tv2-icon); height: var(--tv2-icon); border: 2px solid var(--tv2-mint-strong); border-top-color: var(--tv2-brand); border-radius: 50%; animation: tv2-spin 800ms linear infinite; flex-shrink: 0; }
@keyframes tv2-enter { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes tv2-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes tv2-spin { to { transform: rotate(360deg); } }
@media (max-width: 600px) {
  .tv2-grid-2 { grid-template-columns: 1fr; }
  .tv2-card, .tv2-metric { padding: var(--tv2-space-4); }
  .tv2-button, .tv2-ui a.tv2-button, .tv2-ui button.tv2-button, .tv2-input, .tv2-segments :is(button,a[href]) { min-height: var(--tv2-control-touch); }
  .tv2-dialog { padding: var(--tv2-space-4); }
}
@media (prefers-reduced-motion: reduce) {
  .tv2-ui *, .tv2-ui *::before, .tv2-ui *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Compact record details share the same spacing in every workspace. */
.tv2-record { min-width: 0; padding: var(--tv2-space-4); border: 1px solid var(--tv2-border); border-radius: var(--tv2-radius-control); background: var(--tv2-surface); }
.tv2-badge--wrap { white-space: normal; overflow-wrap: anywhere; }

.tv2-record > .tv2-card__header { flex-wrap: wrap; }
.tv2-record > .tv2-card__header > :first-child { flex: 1 0 min(100%,180px); }
.tv2-record > .tv2-card__header > :last-child { flex: 3 1 320px; min-width: 0; }

/* Paginadores compartidos: las páginas se distribuyen en filas si falta ancho. */
.tv2-ui :is([data-tv2-page-controls],.tv2-comm-pager__controls) { display:flex; flex-wrap:wrap; gap:var(--tv2-space-1); max-width:100%; }

@media(max-width:600px) { .tv2-ui .tv2-button.tv2-button--square { width:var(--tv2-control-touch); height:var(--tv2-control-touch); min-height:var(--tv2-control-touch); flex-basis:var(--tv2-control-touch); } }