/*
 * Lemon Think CRM UI System v4
 * ---------------------------------------------------------------
 * Capa visual cargada después de app.css.
 * - Centraliza tokens, temas, tipografía, densidad y componentes.
 * - No reestructura tablas ni pantallas de forma genérica.
 * - El responsive estructural se activa únicamente por módulo.
 */

:root {
  /* Tipografía */
  --crm-font-body: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --crm-font-display: "Syne", "DM Sans", system-ui, sans-serif;
  --crm-font-size: var(--base-font-size, 15px);
  --crm-font-size-list: calc(var(--crm-font-size) * .94);
  --crm-font-size-control: calc(var(--crm-font-size) * .90);
  --crm-font-size-filter: calc(var(--crm-font-size) * .84);
  --crm-font-size-action: calc(var(--crm-font-size) * .82);
  --crm-font-size-meta: calc(var(--crm-font-size) * .78);
  --crm-font-size-label: calc(var(--crm-font-size) * .72);
  --crm-font-size-badge: calc(var(--crm-font-size) * .72);
  --crm-font-size-sm: var(--crm-font-size-meta);
  --crm-font-size-xs: var(--crm-font-size-label);

  /* Densidad compacta por defecto */
  --crm-control-h: 36px;
  --crm-control-h-compact: 32px;
  --crm-control-h-row: 28px;
  --crm-control-padding-x: 11px;
  --crm-control-padding-x-compact: 9px;
  --crm-row-padding-y: 8px;
  --crm-row-padding-x: 11px;

  /* Espaciado */
  --crm-space-1: 4px;
  --crm-space-2: 8px;
  --crm-space-3: 12px;
  --crm-space-4: 16px;
  --crm-space-5: 20px;
  --crm-space-6: 24px;
  --crm-space-8: 32px;
  --crm-page-gutter: clamp(20px, 2.1vw, 36px);
  --crm-page-gutter-mobile: 14px;

  /* Forma */
  --crm-radius-xs: 6px;
  --crm-radius-sm: 8px;
  --crm-radius-md: 12px;
  --crm-radius-lg: 17px;
  --crm-radius-pill: 999px;

  /* Tema base */
  --crm-bg: #f5f6f4;
  --crm-surface: #ffffff;
  --crm-surface-raised: #ffffff;
  --crm-surface-muted: #f7f8f7;
  --crm-surface-hover: #f2f4f3;
  --crm-text: #171a1f;
  --crm-text-soft: #46505c;
  --crm-muted: #6f7782;
  --crm-border: #e2e6e4;
  --crm-border-strong: #cfd5d2;
  --crm-shadow-card: 0 10px 30px rgba(15, 23, 42, .052), 0 1px 2px rgba(15, 23, 42, .035);
  --crm-shadow-control: 0 1px 1px rgba(15, 23, 42, .025);
  --crm-shadow-primary: 0 8px 18px color-mix(in srgb, var(--crm-accent) 18%, transparent);

  /* Colores configurables existentes */
  --crm-accent: var(--ui-accent, #2684ff);
  --crm-accent-text: var(--ui-button-text, #ffffff);
  --crm-link: var(--ui-link, #1769aa);
  --crm-danger: #dc3f47;
  --crm-danger-soft: #fff1f2;
  --crm-success: #159665;
  --crm-warning: #d97706;
  --crm-focus-ring: color-mix(in srgb, var(--crm-accent) 22%, transparent);
}

/* Temas: solo cambian tokens; la estructura no se duplica. */
body[data-crm-theme="graphite"] {
  --crm-bg: #f1f3f5;
  --crm-surface: #ffffff;
  --crm-surface-raised: #ffffff;
  --crm-surface-muted: #f3f5f7;
  --crm-surface-hover: #eceff2;
  --crm-text: #15191e;
  --crm-text-soft: #404955;
  --crm-muted: #69737e;
  --crm-border: #dce1e5;
  --crm-border-strong: #c8d0d7;
}

body[data-crm-theme="warm"] {
  --crm-bg: #f7f4ee;
  --crm-surface: #fffefa;
  --crm-surface-raised: #ffffff;
  --crm-surface-muted: #f8f3ea;
  --crm-surface-hover: #f2ece2;
  --crm-text: #211d18;
  --crm-text-soft: #514a41;
  --crm-muted: #776f65;
  --crm-border: #e7dfd3;
  --crm-border-strong: #d7ccbd;
}

/* Presets tipográficos. */
body[data-crm-font="dm-sans"] {
  --crm-font-body: "DM Sans", system-ui, sans-serif;
  --crm-font-display: "DM Sans", system-ui, sans-serif;
}
body[data-crm-font="system"] {
  --crm-font-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --crm-font-display: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Densidades. Compacta es la recomendada para este CRM. */
body[data-crm-density="comfortable"] {
  --crm-control-h: 40px;
  --crm-control-h-compact: 36px;
  --crm-control-h-row: 32px;
  --crm-row-padding-y: 10px;
  --crm-row-padding-x: 13px;
}

/* Puente con las variables históricas para que los módulos antiguos
   hereden colores y tipografía del tema sin reescribirse. */
body {
  --bg: var(--crm-bg);
  --surface: var(--crm-surface);
  --surface-alt: var(--crm-surface-muted);
  --text: var(--crm-text);
  --text-muted: var(--crm-muted);
  --border: var(--crm-border);
  --border-strong: var(--crm-border-strong);
  --radius: var(--crm-radius-md);
  --radius-sm: var(--crm-radius-sm);
  --font-body: var(--crm-font-body);
  --font-display: var(--crm-font-display);
  --accent: var(--crm-accent);
  --accent-dark: var(--crm-accent);
  --accent-text: var(--crm-accent-text);
  --link: var(--crm-link);

  margin: 0;
  color: var(--crm-text);
  background: var(--crm-bg);
  font-family: var(--crm-font-body);
  font-size: var(--crm-font-size);
}

html { background: var(--crm-bg); }
button, input, select, textarea { font: inherit; }
a { color: var(--crm-link); }

/* ------------------------------------------------------------------
   LAYOUT
   No se calcula un ancho paralelo al del layout antiguo. La barra
   lateral usa --sidebar-width y .main ocupa automáticamente el resto.
   ------------------------------------------------------------------ */
.layout {
  width: 100%;
  min-width: 0;
}

.main {
  flex: 1 1 auto;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin-left: var(--sidebar-width) !important;
  padding: 28px var(--crm-page-gutter) 48px !important;
  background: var(--crm-bg) !important;
  box-sizing: border-box;
  overflow-x: clip;
}

.main > * { max-width: none; }
.main > :first-child { margin-top: 0; }

/* Evita cabeceras/títulos comprimidos letra a letra. */
.page-header,
.lt-page-head,
.lt-project-hero,
.lt-dashboard-section-head,
.lt-card-header-modern,
.card__header {
  min-width: 0;
}
.page-header h1,
.page-title,
.lt-page-head h1,
.lt-project-hero h1,
.lt-dashboard-section-head h2,
h1, h2, h3 {
  font-family: var(--crm-font-display);
  overflow-wrap: normal;
  word-break: normal;
  writing-mode: horizontal-tb;
}
.page-header h1,
.page-title,
.lt-page-head h1,
h1 {
  color: var(--crm-text);
  letter-spacing: -.035em;
}

/* ------------------------------------------------------------------
   CONTROLES
   ------------------------------------------------------------------ */
.main :is(
  .form-input,
  .form-select,
  .crm-datepicker__trigger,
  input[type="text"],
  input[type="search"],
  input[type="email"],
  input[type="password"],
  input[type="number"],
  input[type="date"],
  input[type="time"],
  input[type="url"],
  input[type="tel"],
  select
),
.modal :is(
  .form-input,
  .form-select,
  .crm-datepicker__trigger,
  input[type="text"],
  input[type="search"],
  input[type="email"],
  input[type="password"],
  input[type="number"],
  input[type="date"],
  input[type="time"],
  input[type="url"],
  input[type="tel"],
  select
),
.login-card :is(.form-input, input[type="text"], input[type="email"], input[type="password"]) {
  height: var(--crm-control-h) !important;
  min-height: var(--crm-control-h) !important;
  max-height: var(--crm-control-h) !important;
  padding: 0 var(--crm-control-padding-x) !important;
  border: 1px solid var(--crm-border-strong) !important;
  border-radius: var(--crm-radius-sm) !important;
  background-color: var(--crm-surface) !important;
  color: var(--crm-text) !important;
  font-size: var(--crm-font-size-control) !important;
  line-height: 1.2 !important;
  box-shadow: var(--crm-shadow-control) !important;
  outline: none;
  box-sizing: border-box;
}

.main textarea.form-input,
.main textarea,
.modal textarea.form-input,
.modal textarea {
  min-height: 92px !important;
  max-height: none !important;
  height: auto !important;
  padding: 9px var(--crm-control-padding-x) !important;
  line-height: 1.45 !important;
  resize: vertical;
}

.main :is(.form-input, .form-select, input, select, textarea):focus,
.modal :is(.form-input, .form-select, input, select, textarea):focus,
.lt-client-picker__button:focus-visible {
  border-color: var(--crm-accent) !important;
  box-shadow: 0 0 0 3px var(--crm-focus-ring) !important;
}

.main select,
.main .form-select,
.modal select,
.modal .form-select {
  padding-right: 31px !important;
  cursor: pointer;
}

.form-label,
.form-field > label,
.form-group > label {
  color: var(--crm-text-soft);
  font-size: var(--crm-font-size-label);
  font-weight: 700;
  letter-spacing: .045em;
  text-transform: uppercase;
}
.form-hint { color: var(--crm-muted); }

/* Selector avanzado de clientes: visualmente es el mismo control. */
.lt-client-picker { min-width: 0; }
.lt-client-picker__button {
  width: 100%;
  min-height: var(--crm-control-h) !important;
  height: var(--crm-control-h) !important;
  padding: 0 var(--crm-control-padding-x) !important;
  border: 1px solid var(--crm-border-strong) !important;
  border-radius: var(--crm-radius-sm) !important;
  background: var(--crm-surface) !important;
  color: var(--crm-text) !important;
  box-shadow: var(--crm-shadow-control) !important;
  font-size: var(--crm-font-size-control) !important;
}
.lt-client-picker__label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lt-client-picker__action { color: var(--crm-text); font-size: var(--crm-font-size-meta); font-weight: 700; }

/* Filtros y barras: todos compactos. */
:is(
  .crm-list-filters,
  .lt-simple-task-filters,
  .lt-finance-filter-bar,
  .lt-agenda-filter,
  .lt-dashboard-project-filter-form,
  .lt-dashboard-section-actions,
  .lt-comm-filters-final,
  .lt-comm-filters,
  .lt-notif-filters,
  .lt-client-activity-toolbar,
  .lt-planner-toolbar,
  .lt-page-head--toolbar-only,
  .lt-agenda-toolbar
) :is(
  .form-input,
  .form-select,
  .crm-datepicker__trigger,
  .lt-client-picker__button,
  input[type="text"],
  input[type="search"],
  input[type="date"],
  select,
  .btn
),
.crm-filter-select,
.lt-dashboard-filter-select--compact {
  min-height: var(--crm-control-h-compact) !important;
  height: var(--crm-control-h-compact) !important;
  max-height: var(--crm-control-h-compact) !important;
  border-radius: var(--crm-radius-sm) !important;
  font-size: var(--crm-font-size-filter) !important;
}

.crm-list-filters,
.lt-simple-task-filters,
.lt-finance-filter-bar,
.lt-comm-filters-final,
.lt-notif-filters,
.lt-client-activity-toolbar,
.lt-planner-toolbar {
  gap: var(--crm-space-2) !important;
  align-items: end !important;
}

/* ------------------------------------------------------------------
   BOTONES
   Dos familias principales: relleno y contorno. Ghost para acciones
   terciarias. Todos comparten geometría y tipografía.
   ------------------------------------------------------------------ */
.btn,
a.btn,
button.btn {
  min-height: var(--crm-control-h) !important;
  height: var(--crm-control-h) !important;
  max-height: var(--crm-control-h) !important;
  padding: 0 12px !important;
  border: 1px solid transparent !important;
  border-radius: var(--crm-radius-sm) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  color: var(--crm-text);
  font-family: var(--crm-font-body) !important;
  font-size: var(--crm-font-size-control) !important;
  font-weight: 650 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  cursor: pointer;
  box-sizing: border-box;
  transition: border-color .14s ease, background-color .14s ease, color .14s ease, box-shadow .14s ease, transform .14s ease;
}

.btn--sm,
.btn--xs,
:is(
  .data-table,
  .lt-table-modern,
  .lt-comm-table,
  .lt-notif-table,
  .lt-users-table,
  .lt-providers-table,
  .lt-finance-list-table,
  .lt-backup-table,
  .lt-team-table,
  .lt-activity-types-table
) :is(.actions, .lt-actions-cell, .crm-row-actions) .btn {
  min-height: var(--crm-control-h-row) !important;
  height: var(--crm-control-h-row) !important;
  max-height: var(--crm-control-h-row) !important;
  padding: 0 9px !important;
  border-radius: var(--crm-radius-xs) !important;
  font-size: var(--crm-font-size-action) !important;
}

.btn--primary,
button.btn--primary,
a.btn--primary {
  background: var(--crm-accent) !important;
  border-color: var(--crm-accent) !important;
  color: var(--crm-accent-text) !important;
  box-shadow: var(--crm-shadow-primary) !important;
}
.btn--primary:hover { filter: brightness(.97); transform: translateY(-1px); }

.btn--outline,
button.btn--outline,
a.btn--outline,
.btn--secondary,
button.btn--secondary,
a.btn--secondary {
  background: var(--crm-surface) !important;
  border-color: var(--crm-border-strong) !important;
  color: var(--crm-text) !important;
  box-shadow: var(--crm-shadow-control) !important;
}
.btn--outline:hover,
.btn--secondary:hover { background: var(--crm-surface-hover) !important; border-color: color-mix(in srgb, var(--crm-border-strong) 70%, var(--crm-text)); }

.btn--ghost,
button.btn--ghost,
a.btn--ghost {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--crm-muted) !important;
  box-shadow: none !important;
}
.btn--ghost:hover { background: var(--crm-surface-hover) !important; color: var(--crm-text) !important; }

.btn--danger,
button.btn--danger,
a.btn--danger {
  background: var(--crm-danger) !important;
  border-color: var(--crm-danger) !important;
  color: #fff !important;
}

/* Grupos de acciones coherentes. */
.actions,
.lt-page-head__actions,
.page-header__actions,
.lt-page-actions-inline,
.lt-dashboard-section-actions,
.lt-gantt-actions,
.lt-team-actions,
.lt-type-actions,
.lt-client-actions {
  gap: 6px !important;
  align-items: center;
}
:is(
  .data-table,
  .lt-table-modern,
  .lt-comm-table,
  .lt-notif-table,
  .lt-users-table,
  .lt-providers-table,
  .lt-finance-list-table,
  .lt-backup-table,
  .lt-team-table,
  .lt-activity-types-table
) :is(.actions, .lt-actions-cell, .crm-row-actions) {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 5px !important;
  flex-wrap: nowrap !important;
  white-space: nowrap;
}
:is(
  .data-table,
  .lt-table-modern,
  .lt-comm-table,
  .lt-notif-table,
  .lt-users-table,
  .lt-providers-table,
  .lt-finance-list-table,
  .lt-backup-table,
  .lt-team-table,
  .lt-activity-types-table
) :is(.actions, .lt-actions-cell, .crm-row-actions) form { display: inline-flex !important; margin: 0 !important; }

/* ------------------------------------------------------------------
   TARJETAS, TABLAS Y BADGES
   ------------------------------------------------------------------ */
.card,
.lt-modern-card,
.lt-backup-card,
.lt-projects-timeline-card {
  background: var(--crm-surface) !important;
  border: 1px solid var(--crm-border) !important;
  border-radius: var(--crm-radius-lg) !important;
  box-shadow: var(--crm-shadow-card) !important;
}
.card__header { border-color: var(--crm-border) !important; }

.table-wrap,
.lt-table-wrap-modern,
.lt-comm-table-wrap,
.lt-notif-table-wrap,
.lt-users-table-wrap,
.lt-providers-table-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

table.data-table,
table.lt-table-modern,
table.lt-comm-table,
table.lt-notif-table,
table.lt-users-table,
table.lt-providers-table,
table.table,
table.lt-backup-table,
table.lt-finance-list-table,
table.lt-finance-month-table,
table.lt-dashboard-task-table,
table.lt-dashboard-late-table,
table.lt-projects-list-table,
table.lt-team-table,
table.lt-activity-types-table,
table.lt-db-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: auto;
  background: var(--crm-surface);
}

.data-table thead th,
.lt-table-modern thead th,
.lt-comm-table thead th,
.lt-notif-table thead th,
.lt-users-table thead th,
.lt-providers-table thead th,
.table thead th,
.lt-backup-table thead th,
.lt-finance-list-table thead th,
.lt-finance-month-table thead th,
.lt-dashboard-task-table thead th,
.lt-dashboard-late-table thead th,
.lt-projects-list-table thead th,
.lt-team-table thead th,
.lt-activity-types-table thead th,
.lt-db-table thead th {
  padding: 9px var(--crm-row-padding-x) !important;
  background: var(--crm-surface-muted) !important;
  color: var(--crm-muted) !important;
  border-bottom: 1px solid var(--crm-border) !important;
  font-size: var(--crm-font-size-label) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: .055em !important;
  text-transform: uppercase;
  white-space: nowrap;
}

.data-table tbody td,
.lt-table-modern tbody td,
.lt-comm-table tbody td,
.lt-notif-table tbody td,
.lt-users-table tbody td,
.lt-providers-table tbody td,
.table tbody td,
.lt-backup-table tbody td,
.lt-finance-list-table tbody td,
.lt-finance-month-table tbody td,
.lt-dashboard-task-table tbody td,
.lt-dashboard-late-table tbody td,
.lt-projects-list-table tbody td,
.lt-team-table tbody td,
.lt-activity-types-table tbody td,
.lt-db-table tbody td {
  padding: var(--crm-row-padding-y) var(--crm-row-padding-x) !important;
  color: var(--crm-text);
  border-bottom: 1px solid var(--crm-border) !important;
  font-size: var(--crm-font-size-list);
  line-height: 1.25;
  vertical-align: middle;
}
.data-table tbody tr:last-child td { border-bottom: 0 !important; }
.data-table tbody tr:hover td { background: color-mix(in srgb, var(--crm-surface-hover) 70%, transparent); }

.lt-simple-task-title-wrap { min-width: 0; }
.lt-simple-task-title { min-width: 0; line-height: 1.2; }
.lt-simple-task-title strong {
  display: block;
  min-width: 0;
  color: var(--crm-text);
  font-size: var(--crm-font-size-list);
  line-height: 1.2;
  overflow-wrap: anywhere;
  word-break: normal;
}
.lt-table-subtitle { color: var(--crm-muted) !important; font-size: var(--crm-font-size-meta) !important; line-height: 1.25 !important; }

.badge,
.badge-estado,
.badge-prioridad,
[class*="badge--"] {
  border-radius: var(--crm-radius-pill) !important;
  font-size: var(--crm-font-size-badge) !important;
  line-height: 1 !important;
  padding: 4px 7px !important;
  white-space: nowrap;
}

/* Tabs y segmentados usan los mismos tokens. */
.segmented-control,
.tabs,
.lt-tabs,
.lt-finance-tabs {
  border-color: var(--crm-border) !important;
  background: var(--crm-surface-muted) !important;
}
.segmented-control__item,
.tab-btn,
.lt-tabs .btn,
.tabs .btn {
  border-radius: var(--crm-radius-sm) !important;
  color: var(--crm-muted) !important;
}
.segmented-control__item.is-active,
.tab-btn.is-active,
.lt-tabs .is-active,
.tabs .is-active {
  color: var(--crm-accent-text) !important;
  background: var(--crm-accent) !important;
  border-color: var(--crm-accent) !important;
}

/* ------------------------------------------------------------------
   PANTALLAS CON TRATAMIENTO ESPECÍFICO
   ------------------------------------------------------------------ */

/* Dashboard: evita compresión de títulos y deja el ancho completo. */
.lt-dashboard-v2 { width: 100%; max-width: none !important; }
.lt-dashboard-work-main,
.lt-dashboard-work-side { min-width: 0; }
.lt-dashboard-section-head h2 {
  min-width: max-content;
  max-width: 100%;
  white-space: normal;
}
.lt-dashboard-section-actions { min-width: 0; display: flex; flex-wrap: wrap; justify-content: flex-end; }

/* Tareas: escritorio conserva una sola fila real. */
.main[data-crm-page="tareas"] .crm-task-table .crm-row-primary { min-width: 230px; }
.main[data-crm-page="tareas"] .crm-task-table td { height: auto !important; }
.main[data-crm-page="tareas"] .crm-mobile-row-toggle { display: none; }
.main[data-crm-page="tareas"] .card { overflow: hidden; }

/* ------------------------------------------------------------------
   RESPONSIVE
   ------------------------------------------------------------------ */
@media (max-width: 1180px) {
  .main { padding-left: 22px !important; padding-right: 22px !important; }
  .lt-dashboard-work-grid { grid-template-columns: 1fr !important; }
  .lt-dashboard-work-side { width: 100%; }
}

@media (max-width: 1024px) {
  .main {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    padding: calc(76px + env(safe-area-inset-top, 0px)) 18px 34px !important;
    overflow-x: hidden;
  }
}

@media (max-width: 760px) {
  :root { --crm-page-gutter-mobile: 14px; }

  .main {
    padding-left: var(--crm-page-gutter-mobile) !important;
    padding-right: var(--crm-page-gutter-mobile) !important;
  }

  .page-header,
  .lt-page-head,
  .lt-project-hero {
    gap: 12px !important;
    margin-bottom: 18px !important;
  }

  .page-title,
  .page-header h1,
  .lt-page-head h1,
  h1 {
    font-size: clamp(24px, 7vw, 29px) !important;
    line-height: 1.08 !important;
  }

  /* Filtros: dos columnas; búsqueda/selector de cliente ocupan todo. */
  :is(.crm-list-filters, .lt-simple-task-filters, .lt-finance-filter-bar, .lt-comm-filters-final, .lt-notif-filters) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
  }
  :is(.crm-list-filters, .lt-simple-task-filters, .lt-finance-filter-bar, .lt-comm-filters-final, .lt-notif-filters) > * {
    min-width: 0 !important;
    max-width: none !important;
    width: 100% !important;
  }
  :is(.crm-list-filters, .lt-simple-task-filters, .lt-finance-filter-bar, .lt-comm-filters-final, .lt-notif-filters) :is(
    input[type="search"],
    .crm-project-search-input,
    .lt-client-picker,
    [data-client-picker],
    .crm-filter-client-picker
  ) {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }

  /* Acciones superiores alineadas, sin botones gigantes. */
  .lt-page-head__actions,
  .page-header__actions,
  .lt-page-actions-inline {
    width: 100%;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
  }

  /* Tareas: tarjeta compacta y expansión sin mover nodos del DOM. */
  .main[data-crm-page="tareas"] .card {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
  }
  .main[data-crm-page="tareas"] .table-wrap { overflow: visible !important; }
  .main[data-crm-page="tareas"] .crm-task-table {
    display: block !important;
    min-width: 0 !important;
    width: 100% !important;
    background: transparent !important;
  }
  .main[data-crm-page="tareas"] .crm-task-table thead { display: none !important; }
  .main[data-crm-page="tareas"] .crm-task-table tbody {
    display: grid !important;
    gap: 10px !important;
  }
  .main[data-crm-page="tareas"] .crm-task-table tr[data-simple-task-row] {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    background: var(--crm-surface) !important;
    border: 1px solid var(--crm-border) !important;
    border-left: 3px solid transparent !important;
    border-radius: var(--crm-radius-md) !important;
    box-shadow: 0 6px 18px rgba(15, 23, 42, .045) !important;
    overflow: hidden !important;
  }
  .main[data-crm-page="tareas"] .crm-task-table tr.is-overdue-task-row { border-left-color: #ef4444 !important; }
  .main[data-crm-page="tareas"] .crm-task-table tr[data-simple-task-row] > td {
    display: none !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 9px 12px !important;
    border: 0 !important;
    border-top: 1px solid var(--crm-border) !important;
    background: var(--crm-surface) !important;
    white-space: normal !important;
    text-align: left !important;
  }
  .main[data-crm-page="tareas"] .crm-task-table tr[data-simple-task-row] > td.crm-row-primary {
    position: relative;
    display: block !important;
    padding: 12px 44px 12px 10px !important;
    border-top: 0 !important;
  }
  .main[data-crm-page="tareas"] .crm-task-table tr[data-simple-task-row].is-crm-expanded > td:not(.crm-row-primary) {
    display: grid !important;
    grid-template-columns: minmax(82px, 30%) minmax(0, 1fr) !important;
    align-items: center;
    gap: 8px;
  }
  .main[data-crm-page="tareas"] .crm-task-table tr[data-simple-task-row].is-crm-expanded > td:not(.crm-row-primary)::before {
    content: attr(data-crm-label);
    color: var(--crm-muted);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
  }
  .main[data-crm-page="tareas"] .crm-task-table tr[data-simple-task-row].is-crm-expanded > td.crm-row-actions {
    display: block !important;
  }
  .main[data-crm-page="tareas"] .crm-task-table .crm-row-actions .actions {
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
  }
  .main[data-crm-page="tareas"] .crm-mobile-row-toggle {
    position: absolute;
    top: 50%;
    right: 9px;
    transform: translateY(-50%);
    display: grid !important;
    place-items: center;
    width: 30px;
    height: 30px;
    min-width: 30px;
    min-height: 30px;
    padding: 0;
    border: 1px solid var(--crm-border-strong);
    border-radius: var(--crm-radius-pill);
    background: var(--crm-surface);
    color: var(--crm-text);
    font-size: 17px;
    line-height: 1;
    box-shadow: none;
  }
  .main[data-crm-page="tareas"] .lt-simple-task-title strong { font-size: var(--crm-font-size-list); }

  /* Las demás tablas no se convierten automáticamente: scroll seguro. */
  .main:not([data-crm-page="tareas"]) .table-wrap {
    overflow-x: auto !important;
    overflow-y: visible;
  }
}

@media (max-width: 480px) {
  :root { --crm-page-gutter-mobile: 12px; }
  :is(.crm-list-filters, .lt-simple-task-filters, .lt-finance-filter-bar, .lt-comm-filters-final, .lt-notif-filters) {
    grid-template-columns: 1fr !important;
  }
  :is(.crm-list-filters, .lt-simple-task-filters, .lt-finance-filter-bar, .lt-comm-filters-final, .lt-notif-filters) :is(
    input[type="search"], .crm-project-search-input, .lt-client-picker, [data-client-picker], .crm-filter-client-picker
  ) { grid-column: auto !important; }
}

/* Auth pages also inherit the same visual tokens. */
.login-page { background: var(--crm-bg) !important; font-family: var(--crm-font-body); }
.login-card {
  background: var(--crm-surface) !important;
  border: 1px solid var(--crm-border) !important;
  border-radius: var(--crm-radius-lg) !important;
  box-shadow: var(--crm-shadow-card) !important;
}

/* Ajustes de escritorio verificados en Tareas y listados con acciones. */
@media (min-width: 761px) {
  .main[data-crm-page="tareas"] > .page-header + .page-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
  }
  .main[data-crm-page="tareas"] > .page-header + .page-header > .lt-simple-task-filters {
    display: grid !important;
    grid-template-columns: minmax(210px, 1fr) minmax(190px, 230px) 145px 145px auto !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: auto !important;
  }
  .main[data-crm-page="tareas"] > .page-header + .page-header > .lt-page-head__actions {
    flex: 0 0 auto !important;
    flex-wrap: nowrap !important;
  }

  .crm-task-table th:last-child,
  .crm-task-table td.crm-row-actions,
  .lt-comm-table th:last-child,
  .lt-comm-table td.lt-comm-col-actions,
  .lt-comm-table td.crm-row-actions {
    position: static !important;
    box-shadow: none !important;
  }
  .crm-task-table td.crm-row-actions { min-width: 150px; }
}

@media (min-width: 761px) and (max-width: 1280px) {
  .main[data-crm-page="tareas"] > .page-header + .page-header {
    flex-wrap: wrap !important;
  }
  .main[data-crm-page="tareas"] > .page-header + .page-header > .lt-simple-task-filters {
    flex-basis: 100% !important;
  }
  .main[data-crm-page="tareas"] > .page-header + .page-header > .lt-page-head__actions {
    margin-left: auto;
  }
}


/* La capa histórica contiene reglas !important de varias fases. Esta
   regla canónica, cargada al final, iguala realmente todos los filtros. */
html body .main :is(
  .crm-list-filters,
  .lt-simple-task-filters,
  .lt-finance-filter-bar,
  .lt-agenda-filter,
  .lt-dashboard-project-filter-form,
  .lt-dashboard-section-actions,
  .lt-comm-filters-final,
  .lt-comm-filters,
  .lt-notif-filters,
  .lt-client-activity-toolbar,
  .lt-planner-toolbar,
  .lt-page-head--toolbar-only,
  .lt-agenda-toolbar
) :is(
  input.form-input,
  input[type="text"],
  input[type="search"],
  input[type="date"],
  select.form-select,
  select,
  .crm-datepicker__trigger,
  .lt-client-picker__button,
  .btn
) {
  height: var(--crm-control-h-compact) !important;
  min-height: var(--crm-control-h-compact) !important;
  max-height: var(--crm-control-h-compact) !important;
  border-radius: var(--crm-radius-sm) !important;
  font-size: var(--crm-font-size-filter) !important;
  line-height: 1 !important;
}

/* Una sola cabecera por pantalla: si el módulo ya renderiza su propio
   h1, se oculta únicamente la cabecera automática inmediatamente anterior. */
.main > .page-header:has(+ .lt-page-head h1),
.main > .page-header:has(+ .lt-project-hero h1),
.main > .page-header:has(+ .lt-client-page h1),
.main > .page-header:has(+ .lt-client-title h1) {
  display: none !important;
}
.main > .page-header:first-child { margin-bottom: 18px; }


/* ==================================================================
   CANONICAL UI V4
   Esta sección es la única capa de normalización sobre el CSS legado.
   Todos los tamaños dependen de --base-font-size y todos los listados
   comparten tipografía, acciones y densidad.
   ================================================================== */

/* Un único tamaño de contenido para tablas y listados. */
html body .main :is(
  table.data-table,
  table.lt-table-modern,
  table.lt-comm-table,
  table.lt-notif-table,
  table.lt-users-table,
  table.lt-providers-table,
  table.lt-backup-table,
  table.lt-finance-list-table,
  table.lt-finance-month-table,
  table.lt-dashboard-task-table,
  table.lt-dashboard-late-table,
  table.lt-projects-list-table,
  table.lt-team-table,
  table.lt-activity-types-table,
  table.lt-db-table
) {
  font-family: var(--crm-font-body) !important;
  font-size: var(--crm-font-size-list) !important;
}

html body .main :is(
  table.data-table,
  table.lt-table-modern,
  table.lt-comm-table,
  table.lt-notif-table,
  table.lt-users-table,
  table.lt-providers-table,
  table.lt-backup-table,
  table.lt-finance-list-table,
  table.lt-finance-month-table,
  table.lt-dashboard-task-table,
  table.lt-dashboard-late-table,
  table.lt-projects-list-table,
  table.lt-team-table,
  table.lt-activity-types-table,
  table.lt-db-table
) tbody td {
  font-family: var(--crm-font-body) !important;
  font-size: var(--crm-font-size-list) !important;
  line-height: 1.28 !important;
}

html body .main :is(
  table.data-table,
  table.lt-table-modern,
  table.lt-comm-table,
  table.lt-notif-table,
  table.lt-users-table,
  table.lt-providers-table,
  table.lt-backup-table,
  table.lt-finance-list-table,
  table.lt-finance-month-table,
  table.lt-dashboard-task-table,
  table.lt-dashboard-late-table,
  table.lt-projects-list-table,
  table.lt-team-table,
  table.lt-activity-types-table,
  table.lt-db-table
) tbody td :is(a:not(.btn), strong) {
  font-family: var(--crm-font-body) !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

html body .main :is(
  table.data-table,
  table.lt-table-modern,
  table.lt-comm-table,
  table.lt-notif-table,
  table.lt-users-table,
  table.lt-providers-table,
  table.lt-backup-table,
  table.lt-finance-list-table,
  table.lt-finance-month-table,
  table.lt-dashboard-task-table,
  table.lt-dashboard-late-table,
  table.lt-projects-list-table,
  table.lt-team-table,
  table.lt-activity-types-table,
  table.lt-db-table
) thead th {
  font-family: var(--crm-font-body) !important;
  font-size: var(--crm-font-size-label) !important;
}

/* Títulos internos de listados: nunca usan la fuente display. */
html body .main :is(
  .lt-simple-task-title strong,
  .lt-client-list-cell a,
  .lt-user-cell__text strong,
  .lt-comm-subject,
  .lt-worklog-entry__content h3,
  .crm-list-item-title
) {
  font-family: var(--crm-font-body) !important;
  font-size: var(--crm-font-size-list) !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  line-height: 1.28 !important;
}

html body .main :is(
  .lt-table-subtitle,
  .project-company-label,
  .lt-user-cell__text span,
  .lt-user-cell__text small,
  .lt-worklog-entry__content p
) {
  font-family: var(--crm-font-body) !important;
  font-size: var(--crm-font-size-meta) !important;
  line-height: 1.3 !important;
}

/* Acciones de fila: enlaces compactos, sin cajas, iguales en todos los listados. */
html body .main :is(
  .data-table,
  .lt-table-modern,
  .lt-comm-table,
  .lt-notif-table,
  .lt-users-table,
  .lt-providers-table,
  .lt-backup-table,
  .lt-finance-list-table,
  .lt-team-table,
  .lt-activity-types-table
) :is(.actions, .lt-actions-cell, .crm-row-actions, .lt-backup-actions-inline) {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 12px !important;
  min-height: 0 !important;
  white-space: nowrap !important;
}

html body .main :is(
  .data-table,
  .lt-table-modern,
  .lt-comm-table,
  .lt-notif-table,
  .lt-users-table,
  .lt-providers-table,
  .lt-backup-table,
  .lt-finance-list-table,
  .lt-team-table,
  .lt-activity-types-table
) :is(.actions, .lt-actions-cell, .crm-row-actions, .lt-backup-actions-inline) :is(a, button, .btn, .lt-action-link) {
  width: auto !important;
  min-width: 0 !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--crm-muted) !important;
  box-shadow: none !important;
  font-family: var(--crm-font-body) !important;
  font-size: var(--crm-font-size-action) !important;
  font-weight: 650 !important;
  line-height: 24px !important;
  text-decoration: none !important;
  transform: none !important;
}

html body .main :is(
  .data-table,
  .lt-table-modern,
  .lt-comm-table,
  .lt-notif-table,
  .lt-users-table,
  .lt-providers-table,
  .lt-backup-table,
  .lt-finance-list-table,
  .lt-team-table,
  .lt-activity-types-table
) :is(.actions, .lt-actions-cell, .crm-row-actions, .lt-backup-actions-inline) :is(a, button, .btn, .lt-action-link):hover {
  color: var(--crm-link) !important;
  background: transparent !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

html body .main :is(.actions, .lt-actions-cell, .crm-row-actions, .lt-backup-actions-inline) .is-danger,
html body .main :is(.actions, .lt-actions-cell, .crm-row-actions, .lt-backup-actions-inline) .btn--danger {
  color: var(--crm-danger) !important;
}

html body .main th.crm-actions-heading,
html body .main .crm-actions-heading {
  text-align: right !important;
}

html body .main td.crm-row-actions,
html body .main td:has(> .lt-actions-cell),
html body .main td:has(> .actions) {
  text-align: right !important;
  vertical-align: middle !important;
}

/* Tareas simples: una sola fila, acciones alineadas y sin columna flotante. */
@media (min-width: 761px) {
  html body .main[data-crm-page="tareas"] .crm-task-table {
    table-layout: fixed !important;
    min-width: 1120px;
  }
  html body .main[data-crm-page="tareas"] .crm-task-table th:nth-child(1) { width: 21%; }
  html body .main[data-crm-page="tareas"] .crm-task-table th:nth-child(2) { width: 17%; }
  html body .main[data-crm-page="tareas"] .crm-task-table th:nth-child(3) { width: 9%; }
  html body .main[data-crm-page="tareas"] .crm-task-table th:nth-child(4) { width: 9%; }
  html body .main[data-crm-page="tareas"] .crm-task-table th:nth-child(5) { width: 7%; }
  html body .main[data-crm-page="tareas"] .crm-task-table th:nth-child(6) { width: 6%; }
  html body .main[data-crm-page="tareas"] .crm-task-table th:nth-child(7),
  html body .main[data-crm-page="tareas"] .crm-task-table th:nth-child(8) { width: 6%; }
  html body .main[data-crm-page="tareas"] .crm-task-table th:nth-child(9) { width: 4%; }
  html body .main[data-crm-page="tareas"] .crm-task-table th:nth-child(10) { width: 15%; }
  html body .main[data-crm-page="tareas"] .crm-task-table td.crm-row-actions,
  html body .main[data-crm-page="tareas"] .crm-task-table th:last-child {
    position: static !important;
    right: auto !important;
    min-width: 0 !important;
    box-shadow: none !important;
  }
  html body .main[data-crm-page="tareas"] .crm-task-table td,
  html body .main[data-crm-page="tareas"] .crm-task-table th {
    overflow: hidden;
    text-overflow: ellipsis;
  }
  html body .main[data-crm-page="tareas"] .crm-task-table td:not(.crm-row-actions) {
    white-space: nowrap;
  }
  html body .main[data-crm-page="tareas"] .crm-task-table .lt-simple-task-title strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

/* Presupuestos: título elástico y truncado; la tabla nunca amplía el viewport. */
html body .main .card[data-ajax-list],
html body .main .card[data-ajax-list] > [data-ajax-list-content],
html body .main .card[data-ajax-list] .table-wrap {
  min-width: 0 !important;
  max-width: 100% !important;
}

html body .main .crm-budget-table {
  width: 100% !important;
  max-width: 100% !important;
  table-layout: fixed !important;
}
html body .main .crm-budget-table .crm-budget-title-cell {
  max-width: 0;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
html body .main .crm-budget-table td,
html body .main .crm-budget-table th {
  min-width: 0;
}
@media (max-width: 1180px) {
  html body .main .crm-budget-table { min-width: 1060px; }
}

/* Formularios: todos los valores usan el mismo tamaño derivado de configuración. */
html body .main :is(
  .form-input,
  .form-select,
  input[type="text"],
  input[type="search"],
  input[type="email"],
  input[type="password"],
  input[type="number"],
  input[type="date"],
  input[type="time"],
  input[type="url"],
  input[type="tel"],
  select,
  .lt-client-picker__button,
  .lt-color-field__hex
) {
  font-family: var(--crm-font-body) !important;
  font-size: var(--crm-font-size-control) !important;
}
html body .main .lt-client-picker__label {
  font-size: inherit !important;
  font-weight: 500 !important;
}
html body .main .lt-client-picker__action {
  font-size: var(--crm-font-size-meta) !important;
}

html body #proyecto-form .lt-project-form-row--project-basics :is(.form-input, .form-select, .lt-client-picker__button),
html body #proyecto-form .lt-project-form-secondary-grid--compact :is(.form-input, .form-select, input[type="date"].form-input, .lt-color-field__picker, .lt-color-field__hex) {
  height: var(--crm-control-h) !important;
  min-height: var(--crm-control-h) !important;
  max-height: var(--crm-control-h) !important;
  border-radius: var(--crm-radius-sm) !important;
  font-size: var(--crm-font-size-control) !important;
}

/* Diario: las entradas se comportan como filas de listado, no como titulares. */
html body .main[data-crm-page="diario"] .lt-worklog-entry__content h3 {
  font-family: var(--crm-font-body) !important;
  font-size: var(--crm-font-size-list) !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
}
html body .main[data-crm-page="diario"] .lt-worklog-entry__actions .btn {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--crm-muted) !important;
  padding: 0 !important;
  height: 24px !important;
  min-height: 24px !important;
  font-size: var(--crm-font-size-action) !important;
}

/* En móvil se conserva la adaptación específica de Tareas, con margen simétrico. */
@media (max-width: 760px) {
  html body .main[data-crm-page="tareas"] {
    padding-left: var(--crm-page-gutter-mobile) !important;
    padding-right: var(--crm-page-gutter-mobile) !important;
  }
  html body .main[data-crm-page="tareas"] .crm-task-table tr[data-simple-task-row] {
    box-shadow: none !important;
  }
  html body .main[data-crm-page="tareas"] .crm-task-table tr[data-simple-task-row] > td.crm-row-primary {
    font-size: var(--crm-font-size-list) !important;
  }
}

/* Corrección semántica: la celda sigue siendo table-cell; solo su contenedor interno es flex. */
html body .main td.crm-row-actions {
  display: table-cell !important;
}
html body .main td.crm-row-actions > .actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
}
html body .main table.data-table td.crm-row-actions,
html body .main table.lt-table-modern td.crm-row-actions,
html body .main table.lt-comm-table td.crm-row-actions {
  display: table-cell !important;
}
html body .main table td.lt-actions-cell {
  display: table-cell !important;
  text-align: right !important;
  vertical-align: middle !important;
}
html body .main table td.lt-actions-cell > form {
  display: inline-flex !important;
  margin: 0 0 0 10px !important;
}


/* ==================================================================
   V5 · Correcciones específicas verificadas
   - Tareas: acciones ocupan solo su contenido, sin hueco lateral.
   - Finanzas: acciones directas en línea, sin menú desplegable.
   - Presupuestos: cliente y título se truncan dentro de su columna.
   ================================================================== */

@media (min-width: 761px) {
  html body .main[data-crm-page="tareas"] .crm-task-table--full {
    table-layout: auto !important;
    min-width: 1180px !important;
  }

  html body .main[data-crm-page="tareas"] .crm-task-table--full th,
  html body .main[data-crm-page="tareas"] .crm-task-table--full td {
    width: auto !important;
  }

  html body .main[data-crm-page="tareas"] .crm-task-table--full th:nth-child(1),
  html body .main[data-crm-page="tareas"] .crm-task-table--full td:nth-child(1) {
    width: 24% !important;
    max-width: 0;
  }

  html body .main[data-crm-page="tareas"] .crm-task-table--full th:nth-child(2),
  html body .main[data-crm-page="tareas"] .crm-task-table--full td:nth-child(2) {
    width: 20% !important;
    max-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  html body .main[data-crm-page="tareas"] .crm-task-table--full th:nth-child(n+3):nth-child(-n+9),
  html body .main[data-crm-page="tareas"] .crm-task-table--full td:nth-child(n+3):nth-child(-n+9) {
    width: 1% !important;
    white-space: nowrap;
  }

  html body .main[data-crm-page="tareas"] .crm-task-table--full th:nth-child(10),
  html body .main[data-crm-page="tareas"] .crm-task-table--full td:nth-child(10) {
    width: 1% !important;
    min-width: 154px !important;
    padding-left: 8px !important;
    padding-right: 12px !important;
    white-space: nowrap !important;
  }

  html body .main[data-crm-page="tareas"] .crm-task-table--full td.crm-row-actions > .lt-actions-cell {
    width: max-content !important;
    margin-left: auto !important;
    gap: 12px !important;
  }
}

html body .main .lt-finance-list-table td.lt-actions-cell {
  min-width: 250px;
}

html body .main .crm-finance-inline-actions {
  width: max-content !important;
  margin-left: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 12px !important;
  white-space: nowrap !important;
}

html body .main .crm-finance-inline-actions form {
  display: inline-flex !important;
  margin: 0 !important;
}

html body .main .crm-finance-inline-actions .crm-list-action {
  appearance: none;
  width: auto !important;
  min-width: 0 !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--crm-muted) !important;
  font-family: var(--crm-font-body) !important;
  font-size: var(--crm-font-size-action) !important;
  font-weight: 650 !important;
  line-height: 24px !important;
  cursor: pointer;
}

html body .main .crm-finance-inline-actions .crm-list-action:hover {
  color: var(--crm-link) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

html body .main .crm-finance-inline-actions .crm-list-action.is-danger {
  color: var(--crm-danger) !important;
}

html body .main .crm-budget-table .crm-budget-client-cell,
html body .main .crm-budget-table .crm-budget-title-cell {
  min-width: 0 !important;
  max-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body .main .crm-budget-table .crm-budget-client-name,
html body .main .crm-budget-table .crm-budget-client-cell .project-company-label {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html body .main .crm-budget-table td {
  overflow: hidden;
}

/* ------------------------------------------------------------------
   AYUDA CONTEXTUAL
   Las explicaciones de formulario se muestran siempre mediante un
   icono ? discreto y accesible, nunca como texto permanente invasivo.
   ------------------------------------------------------------------ */
.crm-label-with-help {
  display:inline-flex !important;
  align-items:center;
  gap:6px;
  width:max-content;
  max-width:100%;
}
.crm-help {
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 16px;
  width:16px;
  height:16px;
  border:1px solid var(--crm-border-strong);
  border-radius:50%;
  background:var(--crm-surface);
  color:var(--crm-muted);
  font-family:var(--crm-font-body);
  font-size:10px;
  font-weight:800;
  line-height:1;
  letter-spacing:0;
  text-transform:none;
  cursor:help;
  outline:none;
}
.crm-help:hover,
.crm-help:focus-visible {
  border-color:var(--crm-accent);
  color:var(--crm-accent);
  box-shadow:0 0 0 3px var(--crm-focus-ring);
}
.crm-help__tooltip {
  position:absolute;
  z-index:1200;
  left:50%;
  bottom:calc(100% + 8px);
  width:max-content;
  min-width:210px;
  max-width:min(290px,calc(100vw - 28px));
  padding:8px 10px;
  border:1px solid var(--crm-border);
  border-radius:var(--crm-radius-sm);
  background:var(--crm-text);
  color:var(--crm-surface);
  box-shadow:var(--crm-shadow-card);
  font-family:var(--crm-font-body);
  font-size:var(--crm-font-size-meta);
  font-weight:500;
  line-height:1.4;
  letter-spacing:0;
  text-align:left;
  text-transform:none;
  white-space:normal;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate(-50%,4px);
  transition:opacity .14s ease, transform .14s ease, visibility .14s ease;
}
.crm-help__tooltip::after {
  content:"";
  position:absolute;
  top:100%;
  left:50%;
  border:6px solid transparent;
  border-top-color:var(--crm-text);
  transform:translateX(-50%);
}
.crm-help:hover .crm-help__tooltip,
.crm-help:focus .crm-help__tooltip,
.crm-help:focus-visible .crm-help__tooltip {
  opacity:1;
  visibility:visible;
  transform:translate(-50%,0);
}
@media (max-width:520px) {
  .crm-help__tooltip {
    left:0;
    transform:translate(0,4px);
  }
  .crm-help__tooltip::after { left:8px; transform:none; }
  .crm-help:hover .crm-help__tooltip,
  .crm-help:focus .crm-help__tooltip,
  .crm-help:focus-visible .crm-help__tooltip { transform:translate(0,0); }
}

/* ============================================================
   Finanzas · navegación por secciones e ingresos
   ============================================================ */
html body .main .lt-finance-section-tabs {
    display: flex;
    width: max-content;
    max-width: 100%;
    margin: 0 0 var(--crm-space-4, 16px);
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
}
html body .main .lt-finance-section-tabs .lt-finance-list-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}
html body .main .lt-finance-context-target {
    cursor: context-menu;
}
html body .main .lt-finance-context-target:hover {
    color: var(--crm-color-accent, var(--accent-text));
}
html body .main .lt-finance-filter-bar[data-active-finance-tab="ingresos_pendientes"] .finance-filter-pagos,
html body .main .lt-finance-filter-bar[data-active-finance-tab="ingresos_pendientes"] .finance-filter-payment-type,
html body .main .lt-finance-filter-bar[data-active-finance-tab="ingresos_realizados"] .finance-filter-pagos,
html body .main .lt-finance-filter-bar[data-active-finance-tab="ingresos_realizados"] .finance-filter-payment-type {
    display: none !important;
}
html body .main .lt-finance-filter-bar[data-active-finance-tab="pagos_pendientes"] .finance-filter-cobros,
html body .main .lt-finance-filter-bar[data-active-finance-tab="pagos_realizados"] .finance-filter-cobros {
    display: none !important;
}
html body .main .lt-finance-filter-bar[data-active-finance-tab="movimientos"] .finance-filter-cobros,
html body .main .lt-finance-filter-bar[data-active-finance-tab="movimientos"] .finance-filter-pagos,
html body .main .lt-finance-filter-bar[data-active-finance-tab="movimientos"] .finance-filter-payment-type,
html body .main .lt-finance-filter-bar[data-active-finance-tab="movimientos"] .finance-filter-programmed {
    display: none !important;
}
html body .main .lt-finance-name-context button[hidden] {
    display: none !important;
}
@media (max-width: 760px) {
    html body .main .lt-finance-section-tabs {
        width: 100%;
        margin-inline: 0;
    }
}

/* Finanzas · navegación AJAX y guardado de movimientos */
.lt-finance-sections-shell,
.lt-finance-ajax-table {
  position: relative;
}
.lt-finance-sections-shell.is-loading,
.lt-finance-ajax-table.is-loading {
  opacity: .58;
  pointer-events: none;
}
.lt-finance-sections-shell.is-loading::after,
.lt-finance-ajax-table.is-loading::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 20;
  cursor: progress;
}
.lt-finance-form-message,
.lt-finance-page-notice {
  border: 1px solid var(--crm-border, #d9dee5);
  border-radius: var(--crm-radius-sm, 8px);
  background: var(--crm-surface-soft, #f7f9fb);
  color: var(--crm-text, #17202a);
  padding: 9px 11px;
  font-size: var(--crm-font-size-sm, 13px);
  line-height: 1.35;
}
.lt-finance-form-message {
  margin-bottom: 14px;
}
.lt-finance-form-message.is-error,
.lt-finance-page-notice.is-error {
  border-color: rgba(220, 38, 38, .28);
  background: rgba(254, 226, 226, .72);
  color: #991b1b;
}
.lt-finance-form-message.is-success,
.lt-finance-page-notice.is-success {
  border-color: rgba(22, 163, 74, .25);
  background: rgba(220, 252, 231, .72);
  color: #166534;
}
.lt-finance-page-notice {
  margin: 0 0 12px;
}
.lt-finance-list-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-top: 1px solid var(--crm-border, #d9dee5);
}
.lt-finance-list-footer .lt-finance-pagination {
  margin: 0;
}
@media (max-width: 640px) {
  .lt-finance-list-footer { align-items: flex-start; flex-direction: column; }
}

/* Paginación compacta: estados deshabilitados coherentes en todos los listados */
.lt-pagination .btn:disabled,
.lt-pagination button:disabled {
  opacity:.42;
  cursor:not-allowed;
  pointer-events:none;
}

/* ==================================================================
   NORMALIZACIÓN FINAL — controles, Finanzas y Presupuestos
   ================================================================== */

/* Selectores: una sola geometría, sin flechas dobles ni texto recortado. */
html body .main select,
html body .main select.form-select,
html body .modal select,
html body .modal select.form-select {
  display: block !important;
  width: 100%;
  min-width: 0;
  height: var(--crm-control-h) !important;
  min-height: var(--crm-control-h) !important;
  max-height: var(--crm-control-h) !important;
  padding: 0 34px 0 var(--crm-control-padding-x) !important;
  border: 1px solid var(--crm-border-strong) !important;
  border-radius: var(--crm-radius-sm) !important;
  background-color: var(--crm-surface) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 10px center !important;
  background-size: 14px 14px !important;
  color: var(--crm-text) !important;
  font-family: var(--crm-font-body) !important;
  font-size: var(--crm-font-size-control) !important;
  font-weight: 550 !important;
  line-height: normal !important;
  text-indent: 0 !important;
  box-shadow: var(--crm-shadow-control) !important;
  cursor: pointer;
}
html body .main :is(.crm-list-filters,.lt-finance-filter-bar,.lt-simple-task-filters,.lt-comm-filters-final,.lt-notif-filters) select,
html body .main :is(.crm-list-filters,.lt-finance-filter-bar,.lt-simple-task-filters,.lt-comm-filters-final,.lt-notif-filters) select.form-select {
  height: var(--crm-control-h-compact) !important;
  min-height: var(--crm-control-h-compact) !important;
  max-height: var(--crm-control-h-compact) !important;
  padding-left: var(--crm-control-padding-x-compact) !important;
  font-size: var(--crm-font-size-filter) !important;
}
html body .main select option,
html body .modal select option {
  color: var(--crm-text);
  background: var(--crm-surface);
  font-family: var(--crm-font-body);
  font-size: var(--crm-font-size-control);
}
html body .main select:disabled,
html body .modal select:disabled {
  cursor: not-allowed !important;
  opacity: .68;
}

/* Las acciones de cualquier listado conservan contraste al hacer hover. */
html body .main .crm-list-action:hover,
html body .main .lt-actions-cell a:hover,
html body .main .lt-actions-cell button:hover {
  color: var(--crm-link) !important;
  background: transparent !important;
  box-shadow: none !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}
html body .main .crm-list-action.is-danger:hover,
html body .main .lt-actions-cell .is-danger:hover {
  color: var(--crm-danger) !important;
}

/* Finanzas: una fila puede tener subtítulo, pero las acciones permanecen
   centradas verticalmente y en una sola línea. */
html body .main .lt-finance-list-table tbody tr > td {
  vertical-align: middle !important;
}
html body .main .lt-finance-list-table th.crm-actions-heading,
html body .main .lt-finance-list-table td.lt-actions-cell {
  width: 1% !important;
  min-width: 300px !important;
  padding-left: var(--crm-row-padding-x) !important;
  padding-right: var(--crm-row-padding-x) !important;
  text-align: right !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}
html body .main .lt-finance-list-table td.lt-actions-cell > .lt-actions-cell,
html body .main .crm-finance-inline-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body .main .crm-finance-inline-actions form {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body .main .crm-finance-inline-actions .crm-list-action {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 24px !important;
  height: 24px !important;
  line-height: 24px !important;
  white-space: nowrap !important;
}
html body .main .lt-finance-invoice-reference {
  display: block;
  margin-top: 2px;
  color: var(--crm-muted) !important;
  font-size: var(--crm-font-size-meta) !important;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Presupuestos: nunca ensancha el documento. La tabla conserva todas sus
   columnas dentro de un scroll interno cuando el ancho disponible no basta. */
html body .main[data-crm-page="presupuestos"] {
  min-width: 0 !important;
  overflow-x: hidden !important;
}
html body .main[data-crm-page="presupuestos"] .table-wrap {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}
html body .main .crm-budget-table {
  width: 100% !important;
  min-width: 1220px !important;
  max-width: none !important;
  table-layout: fixed !important;
}
html body .main .crm-budget-table :is(th,td) {
  vertical-align: middle !important;
}
html body .main .crm-budget-table .crm-budget-client-cell,
html body .main .crm-budget-table .crm-budget-title-cell {
  min-width: 0 !important;
  max-width: none !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}
html body .main .crm-budget-table .crm-budget-client-name,
html body .main .crm-budget-table .crm-budget-title-cell {
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}
html body .main .crm-budget-table th:last-child,
html body .main .crm-budget-table td:last-child {
  min-width: 96px !important;
  text-align: right !important;
  overflow: visible !important;
}
@media (min-width: 1500px) {
  html body .main .crm-budget-table {
    min-width: 1220px !important;
  }
}

/* Correcciones de robustez · Finanzas 2026-07-30 */
html body .main .lt-finance-list-table th.crm-actions-heading,
html body .main .lt-finance-list-table td.lt-actions-cell {
  width: 1% !important;
  min-width: 0 !important;
  max-width: none !important;
  white-space: nowrap !important;
  text-align: right !important;
}
html body .main .lt-finance-list-table td.lt-actions-cell > .lt-actions-cell,
html body .main .lt-finance-list-table .crm-finance-inline-actions {
  width: max-content !important;
  max-width: none !important;
  margin-left: auto !important;
  gap: 10px !important;
}
html body .main .lt-finance-list-table .crm-finance-inline-actions--compact {
  min-width: 118px !important;
}
html body .main .lt-finance-list-table .crm-list-action,
html body .main .lt-finance-list-table a.crm-list-action:link,
html body .main .lt-finance-list-table a.crm-list-action:visited,
html body .main .lt-finance-list-table button.crm-list-action {
  color: var(--crm-muted) !important;
  -webkit-text-fill-color: var(--crm-muted) !important;
  background: transparent !important;
  text-shadow: none !important;
}
html body .main .lt-finance-list-table .crm-list-action:hover,
html body .main .lt-finance-list-table .crm-list-action:focus-visible,
html body .main .lt-finance-list-table a.crm-list-action:hover,
html body .main .lt-finance-list-table button.crm-list-action:hover {
  color: var(--crm-link) !important;
  -webkit-text-fill-color: var(--crm-link) !important;
  background: transparent !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
  box-shadow: none !important;
}
html body .main .lt-finance-list-table .crm-list-action.is-danger,
html body .main .lt-finance-list-table .crm-list-action.is-danger:hover {
  color: var(--crm-danger) !important;
  -webkit-text-fill-color: var(--crm-danger) !important;
}

/* ==================================================================
   ESTABILIZACIÓN DE LISTADOS Y CONTRATOS · 2026-07-30
   Una única fila, acciones compactas y hover siempre legible.
   ================================================================== */

/* Finanzas: la tabla se reparte de forma determinista. Si el viewport no
   alcanza, se desplaza dentro de su contenedor; nunca se pisan columnas. */
html body .main .lt-finance-list-card .table-wrap {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}
html body .main table.lt-finance-list-table {
  width: 100% !important;
  min-width: 1120px !important;
  table-layout: fixed !important;
}
html body .main table.lt-finance-list-table th,
html body .main table.lt-finance-list-table td {
  min-width: 0 !important;
  vertical-align: middle !important;
}
html body .main table.lt-finance-list-table tbody td:not(.lt-actions-cell) {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
html body .main table.lt-finance-list-table .lt-finance-context-target {
  display: block !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: var(--crm-text) !important;
  -webkit-text-fill-color: var(--crm-text) !important;
}
html body .main table.lt-finance-list-table .lt-finance-context-target:hover,
html body .main table.lt-finance-list-table .lt-finance-context-target:focus-visible {
  color: var(--crm-link) !important;
  -webkit-text-fill-color: var(--crm-link) !important;
  background: transparent !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* Anchos comunes. */
html body .main table.lt-finance-list-table th:last-child,
html body .main table.lt-finance-list-table td:last-child,
html body .main table.lt-finance-list-table th.crm-actions-heading,
html body .main table.lt-finance-list-table td.lt-actions-cell {
  width: 150px !important;
  min-width: 150px !important;
  max-width: 150px !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
  text-align: right !important;
  white-space: nowrap !important;
  overflow: visible !important;
}
html body .main table.lt-finance-list-table--income th:nth-last-child(2),
html body .main table.lt-finance-list-table--income td:nth-last-child(2),
html body .main table.lt-finance-list-table--payment th:nth-last-child(2),
html body .main table.lt-finance-list-table--payment td:nth-last-child(2),
html body .main table.lt-finance-list-table--all th:nth-last-child(2),
html body .main table.lt-finance-list-table--all td:nth-last-child(2) {
  width: 96px !important;
}
html body .main table.lt-finance-list-table--income th:nth-last-child(3),
html body .main table.lt-finance-list-table--income td:nth-last-child(3),
html body .main table.lt-finance-list-table--payment th:nth-last-child(3),
html body .main table.lt-finance-list-table--payment td:nth-last-child(3),
html body .main table.lt-finance-list-table--all th:nth-last-child(3),
html body .main table.lt-finance-list-table--all td:nth-last-child(3) {
  width: 104px !important;
}
html body .main table.lt-finance-list-table--income th:nth-last-child(4),
html body .main table.lt-finance-list-table--income td:nth-last-child(4),
html body .main table.lt-finance-list-table--payment th:nth-last-child(4),
html body .main table.lt-finance-list-table--payment td:nth-last-child(4),
html body .main table.lt-finance-list-table--all th:nth-last-child(4),
html body .main table.lt-finance-list-table--all td:nth-last-child(4) {
  width: 94px !important;
}
html body .main table.lt-finance-list-table--income th:nth-last-child(5),
html body .main table.lt-finance-list-table--income td:nth-last-child(5),
html body .main table.lt-finance-list-table--payment th:nth-last-child(5),
html body .main table.lt-finance-list-table--payment td:nth-last-child(5),
html body .main table.lt-finance-list-table--all th:nth-last-child(5),
html body .main table.lt-finance-list-table--all td:nth-last-child(5) {
  width: 104px !important;
}

/* Solo se muestran dos acciones como máximo. El resto continúa disponible
   mediante clic derecho sobre el concepto. */
html body .main table.lt-finance-list-table td.lt-actions-cell > .lt-actions-cell,
html body .main table.lt-finance-list-table .crm-finance-inline-actions,
html body .main table.lt-finance-list-table .crm-finance-inline-actions--compact {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body .main table.lt-finance-list-table .crm-finance-inline-actions .crm-list-action,
html body .main table.lt-finance-list-table .crm-finance-inline-actions a.crm-list-action,
html body .main table.lt-finance-list-table .crm-finance-inline-actions button.crm-list-action {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  height: 24px !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--crm-muted) !important;
  -webkit-text-fill-color: var(--crm-muted) !important;
  font: inherit !important;
  font-size: var(--crm-font-size-action) !important;
  font-weight: 650 !important;
  line-height: 24px !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  cursor: pointer !important;
}
html body .main table.lt-finance-list-table .crm-finance-inline-actions .crm-list-action:hover,
html body .main table.lt-finance-list-table .crm-finance-inline-actions .crm-list-action:focus-visible {
  color: var(--crm-link) !important;
  -webkit-text-fill-color: var(--crm-link) !important;
  background: transparent !important;
  box-shadow: none !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
  outline: none !important;
}

/* Contrato: estado y todas las acciones comparten una sola barra alineada. */
html body .main[data-crm-page="contratos"] .crm-contract-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  margin: 0 0 18px;
}
html body .main[data-crm-page="contratos"] .crm-contract-toolbar__status,
html body .main[data-crm-page="contratos"] .crm-contract-toolbar__actions {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
html body .main[data-crm-page="contratos"] .crm-contract-toolbar__actions {
  justify-content: flex-end;
  flex-wrap: wrap;
}
html body .main[data-crm-page="contratos"] .crm-contract-toolbar .crm-inline-form {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0;
}
html body .main[data-crm-page="contratos"] .crm-contract-status-select {
  width: 150px !important;
  min-width: 150px !important;
  height: var(--crm-control-h-compact) !important;
  min-height: var(--crm-control-h-compact) !important;
  max-height: var(--crm-control-h-compact) !important;
  font-size: var(--crm-font-size-filter) !important;
}
html body .main[data-crm-page="contratos"] .crm-contract-toolbar__actions .btn {
  min-height: var(--crm-control-h-compact) !important;
  height: var(--crm-control-h-compact) !important;
  margin: 0 !important;
}
html body .main[data-crm-page="contratos"] .crm-contract-delete {
  color: var(--crm-danger) !important;
}
html body .main[data-crm-page="contratos"] .crm-contract-delete:hover {
  color: var(--crm-danger) !important;
  background: color-mix(in srgb, var(--crm-danger) 8%, transparent) !important;
}

/* Hover de enlaces de listados: nunca hereda el texto blanco de botones o
   pestañas activas. */
html body .main :is(.data-table,.lt-table-modern,.lt-finance-list-table) a:not(.btn):hover,
html body .main :is(.data-table,.lt-table-modern,.lt-finance-list-table) a:not(.btn):focus-visible {
  color: var(--crm-link) !important;
  -webkit-text-fill-color: var(--crm-link) !important;
}

@media (max-width: 760px) {
  html body .main[data-crm-page="contratos"] .crm-contract-toolbar {
    align-items: stretch;
    flex-direction: column;
  }
  html body .main[data-crm-page="contratos"] .crm-contract-toolbar__status,
  html body .main[data-crm-page="contratos"] .crm-contract-toolbar__actions {
    justify-content: flex-start;
    width: 100%;
  }
  html body .main[data-crm-page="contratos"] .crm-contract-toolbar__actions .btn,
  html body .main[data-crm-page="contratos"] .crm-contract-toolbar__actions form {
    flex: 1 1 auto;
  }
}

/* Corrección final de tablas financieras: anchuras estables sin superposición */
html body .main .table-wrap { max-width:100%; }
html body .main table.lt-finance-list-table { table-layout:fixed!important; width:100%!important; }
html body .main table.lt-finance-list-table--income { min-width:1080px!important; }
html body .main table.lt-finance-list-table--payment { min-width:1280px!important; }
html body .main table.lt-finance-list-table--all { min-width:1250px!important; }
html body .main table.lt-finance-list-table--income th:first-child,
html body .main table.lt-finance-list-table--income td:first-child { width:250px!important; }
html body .main table.lt-finance-list-table--income th:nth-last-child(5),
html body .main table.lt-finance-list-table--income td:nth-last-child(5) { width:120px!important; }
html body .main table.lt-finance-list-table--income th:nth-last-child(4),
html body .main table.lt-finance-list-table--income td:nth-last-child(4) { width:105px!important; }
html body .main table.lt-finance-list-table--income th:nth-last-child(3),
html body .main table.lt-finance-list-table--income td:nth-last-child(3) { width:120px!important; }
html body .main table.lt-finance-list-table--income th:nth-last-child(2),
html body .main table.lt-finance-list-table--income td:nth-last-child(2) { width:110px!important; }
html body .main table.lt-finance-list-table--income th:last-child,
html body .main table.lt-finance-list-table--income td:last-child { width:165px!important; }

html body .main table.lt-finance-list-table--payment th:first-child,
html body .main table.lt-finance-list-table--payment td:first-child { width:250px!important; }
html body .main table.lt-finance-list-table--payment th:nth-child(2),
html body .main table.lt-finance-list-table--payment td:nth-child(2) { width:205px!important; }
html body .main table.lt-finance-list-table--payment th:nth-last-child(6),
html body .main table.lt-finance-list-table--payment td:nth-last-child(6) { width:170px!important; }
html body .main table.lt-finance-list-table--payment th:nth-last-child(5),
html body .main table.lt-finance-list-table--payment td:nth-last-child(5) { width:120px!important; }
html body .main table.lt-finance-list-table--payment th:nth-last-child(4),
html body .main table.lt-finance-list-table--payment td:nth-last-child(4) { width:105px!important; }
html body .main table.lt-finance-list-table--payment th:nth-last-child(3),
html body .main table.lt-finance-list-table--payment td:nth-last-child(3) { width:120px!important; }
html body .main table.lt-finance-list-table--payment th:nth-last-child(2),
html body .main table.lt-finance-list-table--payment td:nth-last-child(2) { width:110px!important; }
html body .main table.lt-finance-list-table--payment th:last-child,
html body .main table.lt-finance-list-table--payment td:last-child { width:220px!important; }

html body .main table.lt-finance-list-table--all th:last-child,
html body .main table.lt-finance-list-table--all td:last-child { width:205px!important; }
html body .main table.lt-finance-list-table .lt-actions-cell { white-space:nowrap!important; overflow:visible!important; text-align:right!important; }
html body .main table.lt-finance-list-table .crm-finance-inline-actions { display:flex!important; justify-content:flex-end!important; align-items:center!important; gap:10px!important; flex-wrap:nowrap!important; }
html body .main table.lt-finance-list-table td { overflow:hidden; text-overflow:ellipsis; }
html body .main table.lt-finance-list-table td.lt-actions-cell { overflow:visible; }
html body .main table .table-empty { text-align:center!important; vertical-align:middle!important; }

/* -------------------------------------------------------------------------
   Rejilla compacta de formularios CRM
   -------------------------------------------------------------------------
   Patrón común para formularios nuevos y migrados. La anchura de cada campo
   se define por columnas, no por reglas aisladas de cada pantalla.
*/
.crm-form-grid {
  --crm-form-columns: 12;
  --crm-form-gap-x: 14px;
  --crm-form-gap-y: 12px;
  display: grid;
  grid-template-columns: repeat(var(--crm-form-columns), minmax(0, 1fr));
  column-gap: var(--crm-form-gap-x);
  row-gap: var(--crm-form-gap-y);
  align-items: end;
  min-width: 0;
}
.crm-form-grid--12 { --crm-form-columns: 12; }
.crm-form-grid--compact { --crm-form-gap-x: 12px; --crm-form-gap-y: 10px; }
.crm-form-grid > * { min-width: 0; margin: 0; }
.crm-span-1{grid-column:span 1}.crm-span-2{grid-column:span 2}.crm-span-3{grid-column:span 3}.crm-span-4{grid-column:span 4}.crm-span-5{grid-column:span 5}.crm-span-6{grid-column:span 6}.crm-span-7{grid-column:span 7}.crm-span-8{grid-column:span 8}.crm-span-9{grid-column:span 9}.crm-span-10{grid-column:span 10}.crm-span-11{grid-column:span 11}.crm-span-12{grid-column:1 / -1}

.crm-form-section {
  border: 1px solid var(--crm-border);
  border-radius: var(--crm-radius-md);
  background: var(--crm-surface-subtle);
  padding: 14px;
}
.crm-form-section__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.crm-form-section__head > :last-child {
  color: var(--crm-text-muted);
  font-size: var(--crm-font-sm);
}

.crm-field-width--xs{max-width:96px}.crm-field-width--sm{max-width:150px}.crm-field-width--md{max-width:230px}.crm-field-width--lg{max-width:360px}

@media (max-width: 760px) {
  .crm-form-section { padding: 12px; }
  .crm-form-section__head { align-items: flex-start; flex-direction: column; gap: 4px; }
}

/* ------------------------------------------------------------------
   Navegación por áreas: dos niveles, una sola barra lateral.
   Todos los colores y medidas parten de tokens para poder cambiar
   tema, paleta o tipografía sin reescribir el componente.
   ------------------------------------------------------------------ */
:root {
  --crm-sidebar-rail-width: 72px;
  --crm-sidebar-panel-width: 216px;
  --sidebar-width: calc(var(--crm-sidebar-rail-width) + var(--crm-sidebar-panel-width));
  --crm-sidebar-rail-bg: #111318;
  --crm-sidebar-panel-bg: #171a20;
  --crm-sidebar-text: rgba(255,255,255,.88);
  --crm-sidebar-muted: rgba(255,255,255,.54);
  --crm-sidebar-border: rgba(255,255,255,.08);
  --crm-sidebar-hover: rgba(255,255,255,.065);
  --crm-sidebar-active-bg: color-mix(in srgb, var(--crm-accent) 17%, transparent);
  --crm-sidebar-active-text: color-mix(in srgb, var(--crm-accent) 86%, white);
  --crm-kanban-ideas: #8b5cf6;
  --crm-kanban-pending: #64748b;
  --crm-kanban-active: var(--crm-accent);
  --crm-kanban-waiting: var(--crm-warning);
  --crm-kanban-paused: #ea580c;
  --crm-kanban-review: #7c3aed;
  --crm-kanban-finished: var(--crm-success);
}
body[data-crm-theme="warm"] {
  --crm-sidebar-rail-bg: #1c1915;
  --crm-sidebar-panel-bg: #25211c;
}
body[data-crm-theme="graphite"] {
  --crm-sidebar-rail-bg: #11151a;
  --crm-sidebar-panel-bg: #181d23;
}
body[data-crm-navigation="dual"] .sidebar {
  width: var(--sidebar-width) !important;
  overflow: hidden !important;
  background: var(--crm-sidebar-panel-bg) !important;
  border-right: 1px solid var(--crm-sidebar-border);
}
body[data-crm-navigation="dual"] .sidebar__brand {
  min-height: 72px;
  padding: 18px 16px !important;
  background: var(--crm-sidebar-rail-bg);
  border-color: var(--crm-sidebar-border) !important;
}
body[data-crm-navigation="dual"] .sidebar__brandname { color: var(--crm-sidebar-text); }
body[data-crm-navigation="dual"] .sidebar__workspace {
  display: grid;
  grid-template-columns: var(--crm-sidebar-rail-width) minmax(0,var(--crm-sidebar-panel-width));
  flex: 1 1 auto;
  min-height: 0;
}
body[data-crm-navigation="dual"] .sidebar__areas {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 5px;
  padding: 12px 8px;
  overflow-y: auto;
  background: var(--crm-sidebar-rail-bg);
  border-right: 1px solid var(--crm-sidebar-border);
}
body[data-crm-navigation="dual"] .sidebar__area-button {
  appearance: none;
  border: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 100%;
  min-height: 58px;
  padding: 7px 3px;
  border-radius: 10px;
  background: transparent;
  color: var(--crm-sidebar-muted);
  font-family: var(--crm-font-body);
  cursor: pointer;
  transition: background .16s ease,color .16s ease,transform .16s ease;
}
body[data-crm-navigation="dual"] .sidebar__area-button svg { width: 20px; height: 20px; }
body[data-crm-navigation="dual"] .sidebar__area-button span {
  max-width: 62px;
  font-size: 9.5px;
  font-weight: 650;
  line-height: 1.1;
  text-align: center;
  overflow-wrap: anywhere;
}
body[data-crm-navigation="dual"] .sidebar__area-button:hover {
  color: var(--crm-sidebar-text);
  background: var(--crm-sidebar-hover);
}
body[data-crm-navigation="dual"] .sidebar__area-button.is-active {
  color: var(--crm-sidebar-active-text);
  background: var(--crm-sidebar-active-bg);
}
body[data-crm-navigation="dual"] .sidebar__nav {
  display: block !important;
  min-width: 0;
  padding: 0 !important;
  overflow-y: auto;
  background: var(--crm-sidebar-panel-bg);
}
body[data-crm-navigation="dual"] .sidebar__area-panel { padding: 17px 12px 20px; }
body[data-crm-navigation="dual"] .sidebar__area-panel[hidden] { display: none !important; }
body[data-crm-navigation="dual"] .sidebar__area-heading {
  display: flex;
  align-items: center;
  min-height: 32px;
  padding: 0 10px 10px;
  color: var(--crm-sidebar-text);
  font-family: var(--crm-font-display);
  font-size: 14px;
  letter-spacing: -.02em;
}
body[data-crm-navigation="dual"] .sidebar__area-links { display: flex; flex-direction: column; gap: 3px; }
body[data-crm-navigation="dual"] .nav-item {
  min-height: 38px;
  padding: 8px 10px !important;
  color: var(--crm-sidebar-muted) !important;
  border-radius: 9px;
  font-size: var(--crm-font-size-filter);
}
body[data-crm-navigation="dual"] .nav-item span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body[data-crm-navigation="dual"] .nav-item svg { width: 18px; height: 18px; opacity: .82; }
body[data-crm-navigation="dual"] .nav-item:hover {
  color: var(--crm-sidebar-text) !important;
  background: var(--crm-sidebar-hover) !important;
}
body[data-crm-navigation="dual"] .nav-item--active {
  color: var(--crm-sidebar-active-text) !important;
  background: var(--crm-sidebar-active-bg) !important;
}
body[data-crm-navigation="dual"] .sidebar__footer {
  padding: 12px 14px !important;
  background: var(--crm-sidebar-panel-bg);
  border-color: var(--crm-sidebar-border) !important;
}
body[data-crm-navigation="dual"] .sidebar__user-name { color: var(--crm-sidebar-text); }
body[data-crm-navigation="dual"] .sidebar__user-role { color: var(--crm-sidebar-muted); }

@media (max-width: 900px) {
  :root {
    --crm-sidebar-rail-width: 64px;
    --crm-sidebar-panel-width: 224px;
    --sidebar-width: min(92vw, 288px);
  }
  body[data-crm-navigation="dual"] .sidebar {
    display: flex !important;
    width: var(--sidebar-width) !important;
    transform: translateX(-105%);
    transition: transform .2s ease;
  }
  body.is-mobile-menu-open[data-crm-navigation="dual"] .sidebar,
  body.crm-menu-open[data-crm-navigation="dual"] .sidebar { transform: translateX(0) !important; }
  body[data-crm-navigation="dual"] .sidebar__workspace {
    grid-template-columns: var(--crm-sidebar-rail-width) minmax(0,1fr);
  }
  body[data-crm-navigation="dual"] .main { margin-left: 0 !important; }
}

/* ------------------------------------------------------------------
   NAVEGACIÓN VERTICAL DE DOS NIVELES
   Nivel 1: áreas. Nivel 2: módulos del área. Conserva los tokens de
   apariencia para futuros cambios de tipografía, color y densidad.
   ------------------------------------------------------------------ */
body[data-crm-navigation="vertical"] {
  --sidebar-width: 272px;
}
body[data-crm-navigation="vertical"] .sidebar {
  width: var(--sidebar-width) !important;
  overflow: hidden !important;
  background: var(--crm-sidebar-panel-bg) !important;
  border-right: 1px solid var(--crm-sidebar-border);
}
body[data-crm-navigation="vertical"] .sidebar__brand {
  min-height: 72px;
  padding: 18px 20px !important;
  background: var(--crm-sidebar-rail-bg);
  border-color: var(--crm-sidebar-border) !important;
}
body[data-crm-navigation="vertical"] .sidebar__brandname { color: var(--crm-sidebar-text); }
body[data-crm-navigation="vertical"] .sidebar__workspace {
  display: flex;
  flex: 1 1 auto;
  min-height: 0;
  flex-direction: column;
  gap: 4px;
  padding: 12px 10px 20px;
  overflow-y: auto;
  background: var(--crm-sidebar-panel-bg);
}
body[data-crm-navigation="vertical"] .sidebar__group { min-width: 0; }
body[data-crm-navigation="vertical"] .sidebar__area-button {
  appearance: none;
  display: grid;
  grid-template-columns: 22px minmax(0,1fr) 18px;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  padding: 9px 11px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--crm-sidebar-muted);
  font-family: var(--crm-font-body);
  font-size: var(--crm-font-size-filter);
  font-weight: 720;
  text-align: left;
  cursor: pointer;
  transition: background .16s ease,color .16s ease;
}
body[data-crm-navigation="vertical"] .sidebar__area-button > svg:first-child { width: 20px; height: 20px; }
body[data-crm-navigation="vertical"] .sidebar__area-button > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body[data-crm-navigation="vertical"] .sidebar__area-chevron {
  width: 17px;
  height: 17px;
  transition: transform .16s ease;
}
body[data-crm-navigation="vertical"] .sidebar__group.is-open .sidebar__area-chevron { transform: rotate(90deg); }
body[data-crm-navigation="vertical"] .sidebar__area-button:hover,
body[data-crm-navigation="vertical"] .sidebar__area-button.is-active {
  color: var(--crm-sidebar-text);
  background: var(--crm-sidebar-hover);
}
body[data-crm-navigation="vertical"] .sidebar__area-panel { padding: 3px 0 8px 22px; }
body[data-crm-navigation="vertical"] .sidebar__area-panel[hidden] { display: none !important; }
body[data-crm-navigation="vertical"] .sidebar__area-links {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-left: 10px;
  border-left: 1px solid var(--crm-sidebar-border);
}
body[data-crm-navigation="vertical"] .nav-item {
  min-height: 36px;
  padding: 7px 10px !important;
  border-radius: 9px;
  color: var(--crm-sidebar-muted) !important;
  font-size: var(--crm-font-size-filter);
}
body[data-crm-navigation="vertical"] .nav-item svg { width: 17px; height: 17px; opacity: .8; }
body[data-crm-navigation="vertical"] .nav-item span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body[data-crm-navigation="vertical"] .nav-item:hover {
  color: var(--crm-sidebar-text) !important;
  background: var(--crm-sidebar-hover) !important;
}
body[data-crm-navigation="vertical"] .nav-item--active {
  color: var(--crm-sidebar-active-text) !important;
  background: var(--crm-sidebar-active-bg) !important;
}
body[data-crm-navigation="vertical"] .sidebar__footer {
  padding: 12px 14px !important;
  background: var(--crm-sidebar-panel-bg);
  border-color: var(--crm-sidebar-border) !important;
}
body[data-crm-navigation="vertical"] .sidebar__user-name { color: var(--crm-sidebar-text); }
body[data-crm-navigation="vertical"] .sidebar__user-role { color: var(--crm-sidebar-muted); }

@media (max-width: 900px) {
  body[data-crm-navigation="vertical"] { --sidebar-width: min(92vw, 292px); }
  body[data-crm-navigation="vertical"] .sidebar {
    display: flex !important;
    width: var(--sidebar-width) !important;
    transform: translateX(-105%);
    transition: transform .2s ease;
  }
  body.is-mobile-menu-open[data-crm-navigation="vertical"] .sidebar,
  body.crm-menu-open[data-crm-navigation="vertical"] .sidebar { transform: translateX(0) !important; }
  body[data-crm-navigation="vertical"] .main { margin-left: 0 !important; }
}


/* Ajustes globales configurables y formularios de tareas. */
body[data-crm-navigation="dual"] .sidebar,
body[data-crm-navigation="vertical"] .sidebar { font-size:var(--sidebar-font-size,14px); }
body[data-crm-navigation="dual"] .nav-item,
body[data-crm-navigation="vertical"] .nav-item,
body[data-crm-navigation="dual"] .sidebar__area-button,
body[data-crm-navigation="vertical"] .sidebar__area-button { font-size:var(--sidebar-font-size,14px); }
.modal .form-input,
.modal .form-select,
.modal .form-textarea,
.lt-embedded-task-editor .form-input,
.lt-embedded-task-editor .form-select,
.lt-embedded-task-editor .form-textarea,
.lt-task-modal-form .form-input,
.lt-task-modal-form .form-select,
.lt-task-modal-form .form-textarea {
  width:100%;min-width:0;max-width:none;box-sizing:border-box;
}
.modal input[type="date"],.modal input[type="datetime-local"],
.lt-embedded-task-editor input[type="date"],.lt-embedded-task-editor input[type="datetime-local"] { width:100%;min-width:0; }
.modal .form-textarea,.lt-embedded-task-editor .form-textarea,.lt-task-modal-form .form-textarea { min-height:130px;resize:vertical; }
.lt-work-task-editor__dialog,.lt-global-task-editor-modal__dialog { width:min(980px,calc(100vw - 32px)); }


/* 2026-08-03 · Formularios de horas: fecha y usuario con ancho útil */
.lt-worklog-modal .lt-worklog-date-field {
  grid-column: span 4;
  min-width: 180px;
}
.lt-worklog-modal .lt-worklog-user-field {
  grid-column: span 8;
  min-width: 0;
}
.lt-worklog-modal .lt-worklog-date-field .form-input,
.lt-worklog-modal .lt-worklog-user-field .form-select {
  width: 100% !important;
  min-width: 0 !important;
}
@media (max-width: 760px) {
  .lt-worklog-modal .lt-worklog-date-field,
  .lt-worklog-modal .lt-worklog-user-field {
    grid-column: 1 / -1;
    min-width: 0;
  }
}

/* Proyecto: tipo de planificación visible y encabezados sin tipografía display. */
html body #proyecto-form .card__title {
  font-family: var(--crm-font-body) !important;
  font-size: calc(var(--crm-font-size) * 1.02) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -.015em !important;
  text-transform: none !important;
}

html body #proyecto-form .lt-project-form-secondary-grid--compact {
  grid-template-columns: 160px 165px 140px 140px minmax(165px, .9fr) minmax(190px, 1fr) 115px 120px !important;
  column-gap: 14px !important;
  row-gap: 16px !important;
  align-items: end !important;
}
html body #proyecto-form .lt-project-field--color { grid-column: 1 !important; }
html body #proyecto-form .lt-project-field--planning-type { grid-column: 2 !important; }
html body #proyecto-form .lt-project-field--date-start { grid-column: 3 !important; }
html body #proyecto-form .lt-project-field--date-end { grid-column: 4 !important; }
html body #proyecto-form .lt-project-field--state { grid-column: 5 !important; }
html body #proyecto-form .lt-project-field--progress-mode { grid-column: 6 !important; }
html body #proyecto-form .lt-project-field--progress-manual { grid-column: 7 !important; }
html body #proyecto-form .lt-project-field--priority { grid-column: 8 !important; }
html body #proyecto-form .lt-project-field--progress-manual[hidden] + .lt-project-field--priority,
html body #proyecto-form .lt-project-field--progress-manual[aria-hidden="true"] + .lt-project-field--priority {
  grid-column: 7 !important;
}
html body #proyecto-form .lt-project-form-description {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
}

@media (max-width: 1380px) {
  html body #proyecto-form .lt-project-form-secondary-grid--compact {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
  html body #proyecto-form .lt-project-field,
  html body #proyecto-form .lt-project-field--progress-manual[hidden] + .lt-project-field--priority,
  html body #proyecto-form .lt-project-field--progress-manual[aria-hidden="true"] + .lt-project-field--priority {
    grid-column: auto !important;
    grid-row: auto !important;
  }
  html body #proyecto-form .lt-project-form-description {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
  }
}
@media (max-width: 900px) {
  html body #proyecto-form .lt-project-form-secondary-grid--compact {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 640px) {
  html body #proyecto-form .lt-project-form-secondary-grid--compact {
    grid-template-columns: 1fr !important;
  }
}
