html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

html,
body {
  height: 100%;
  overscroll-behavior-x: none;
}

/*
  Altura mínima del panel full-width al área útil bajo el header (aprox.).
  Así el flex interno puede llevar form-actions-sticky al pie sin depender
  solo de la cadena flex, que en layouts anidados suele fallar.
*/
:root {
  --app-main-min-height: calc(100dvh - 72px);
  --form-footer-reserve: calc(108px + env(safe-area-inset-bottom, 0px));
  --app-bg-tint: #ffffff;
  --app-card-list-border: rgba(15, 23, 42, 0.08);
  --control-radius: 14px;
  --menu-collapsed-width: 58px;
}

#configPanelDatosClientes .budget-config-options {
  gap: 10px;
}

#configPanelDatosClientes .budget-config-option {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  justify-content: start;
  width: fit-content;
  max-width: 100%;
  font-size: 14px;
  line-height: 1.35;
}

#configPanelDatosClientes .budget-config-option input[type="checkbox"] {
  width: 16px;
  height: 16px;
  min-width: 16px;
  margin: 0;
}

#configPanelDatosClientes .budget-config-option span {
  font-size: 14px;
}

#budgetConfigDialog .budget-config-options,
#saleConfigDialog .budget-config-options {
  gap: 10px;
}

#budgetConfigDialog .budget-config-option,
#saleConfigDialog .budget-config-option {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  justify-content: start;
  width: 100%;
  max-width: 100%;
  font-size: 14px;
  line-height: 1.35;
}

#budgetConfigDialog .budget-config-option input[type="checkbox"],
#saleConfigDialog .budget-config-option input[type="checkbox"] {
  width: 16px;
  height: 16px;
  min-width: 16px;
  margin: 0;
}

#budgetConfigDialog .budget-config-option span,
#saleConfigDialog .budget-config-option span {
  font-size: 14px;
}

/*
  Esta tabla tiene 4 celdas; el patron global .config-edit-row solo prevé 3,
  por eso "Opciones" y el boton eliminar pasaban a otra linea.
*/
#configDatosClientesAdicionales {
  margin-bottom: 20px;
}

#configDatosClientesAdicionales .config-edit-row {
  grid-template-columns: minmax(0, 1fr) minmax(150px, 150px) minmax(100px, 1.4fr) 52px;
  gap: 10px;
  align-items: center;
}

#configDatosClientesAdicionales .config-edit-row .field {
  margin: 0;
  min-width: 0;
}

#configDatosClientesAdicionales .config-edit-row .field input[type="text"],
#configDatosClientesAdicionales .config-edit-row .field select {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

#configDatosClientesAdicionales .config-edit-row .field:nth-child(2),
#configDatosClientesAdicionales .config-edit-row .field:nth-child(2) .filterable-combo {
  max-width: 150px;
}

#configDatosClientesAdicionales .config-edit-row .filterable-combo {
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
}

#configDatosClientesAdicionales .config-multi-combo {
  min-width: 0;
}

#configDatosClientesAdicionales .config-edit-actions {
  justify-content: center;
  min-width: 52px;
  box-sizing: border-box;
}

#configDatosClientesAdicionales .config-edit-actions .icon-button {
  flex-shrink: 0;
}

body {
  font-family: Arial, sans-serif;
  margin: 0;
  background: var(--app-bg-tint);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  overscroll-behavior-x: none;
}

body.is-mobile .table-desktop {
  display: none;
}

body.is-mobile .clientes-cards {
  display: grid;
}

body.is-compact {
  overflow-x: hidden;
}

.app-header {
  position: sticky;
  top: 0;
  z-index: 1100;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 48px;
  padding: 4px 12px;
  box-sizing: border-box;
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid #e5e7eb;
  box-shadow: 0px 4px 16px rgba(15, 23, 42, 0.06);
}

.app-header-left,
.app-header-right {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.app-header-left {
  flex: 1 1 auto;
  overflow: hidden;
}

.app-header-right {
  flex: 0 1 auto;
  min-width: 0;
}

.container {
  display: flex;
  flex: 1;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

.menu {
  width: 220px;
  min-width: 220px;
  min-height: 100%;
  background: linear-gradient(180deg, #001A3A 0%, #001126 100%);
  color: #FFFFFF;
  padding: 16px 12px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
  transition: width 0.2s ease, min-width 0.2s ease, padding 0.2s ease, transform 0.2s ease;
}

.menu-logo {
  min-height: 52px;
  margin-bottom: 26px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #FFFFFF;
}

.menu-logo-placeholder {
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.26);
  background: rgba(255, 255, 255, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.menu-logo-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: none;
}

.menu-logo-text {
  min-width: 0;
  overflow: hidden;
}

.menu-app-name {
  font-size: 11px;
  line-height: 1.2;
  color: #B8C7DC;
  white-space: nowrap;
}

.menu-company-name {
  margin-top: 2px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.menu button.menu-logo {
  padding: 0;
  min-height: 52px;
  margin-bottom: 26px;
  gap: 10px;
  color: #FFFFFF;
  font-size: inherit;
  font-weight: inherit;
  white-space: normal;
  border-radius: 10px;
}

.menu button.menu-logo:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #FFFFFF;
}

.menu button.menu-logo:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.5);
  outline-offset: 2px;
}

body.is-compact:not(.is-mobile):not(.is-menu-open) .menu button.menu-logo {
  justify-content: center;
  margin-bottom: 26px;
  padding: 0;
}

body.is-mobile .menu button.menu-logo {
  justify-content: flex-start;
  padding: 0;
}

.consent-inline-preview {
  max-height: 220px;
  overflow: auto;
  padding: 12px;
  background: #f9fafb;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.45;
  white-space: pre-wrap;
}

.consent-correo-auditoria-pre {
  margin: 0;
  max-height: min(40vh, 360px);
  overflow: auto;
  padding: 12px;
  background: #f9fafb;
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: inherit;
}

.eecc-intento-resumen {
  margin: 0 0 12px;
}

.eecc-gemini-debug-section {
  margin-top: 16px;
}

.eecc-gemini-debug-pre {
  max-height: 420px;
  overflow: auto;
  padding: 12px;
  border: 1px solid var(--border-color, #d9dee8);
  border-radius: 10px;
  background: #f8fafc;
  color: #111827;
  font-size: 12px;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
}

.eecc-gemini-debug-panel {
  margin-top: 12px;
}

.eecc-gemini-debug-panel h4 {
  margin: 16px 0 8px;
  font-size: 14px;
}

.eecc-gemini-debug-images-mount {
  margin-top: 8px;
}

.eecc-gemini-debug-images-empty,
.eecc-gemini-debug-images-status {
  margin: 8px 0 0;
}

.eecc-gemini-debug-images-error {
  margin: 8px 0 0;
  color: #b42318;
}

.eecc-gemini-debug-images {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
  margin-top: 8px;
}

.eecc-gemini-debug-image-card {
  margin: 0;
  border: 1px solid var(--border-color, #d9dee8);
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}

.eecc-gemini-debug-image-card img {
  display: block;
  width: 100%;
  height: auto;
}

.eecc-gemini-debug-image-card figcaption {
  padding: 8px 10px;
  font-size: 12px;
  color: #4b5563;
}

.consent-doc-readonly {
  max-height: min(50vh, 420px);
}

.consent-doc-readonly.is-html {
  white-space: normal;
  background: #ffffff;
}

.consent-expediente-evidence-list {
  display: grid;
  gap: 6px;
}

#consentExpedienteEvidencias.consent-inline-preview {
  max-height: none;
  overflow: visible;
}

.consent-expediente-evidence-row {
  display: grid;
  grid-template-columns: minmax(120px, 180px) minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 6px 0;
  border-bottom: 1px solid #e5e7eb;
}

.consent-expediente-evidence-row:last-child {
  border-bottom: none;
}

.consent-expediente-evidence-label {
  color: #4b5563;
  font-weight: 700;
}

.consent-expediente-evidence-value {
  min-width: 0;
  overflow-wrap: anywhere;
}

.consent-bitacora-detail {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 6px;
}

.consent-bitacora-detail-chip {
  display: inline-flex;
  max-width: 100%;
  align-items: baseline;
  gap: 4px;
  padding: 3px 7px;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  background: #f8fafc;
  color: #475569;
  font-size: 11px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.consent-bitacora-detail-chip code {
  white-space: normal;
  overflow-wrap: anywhere;
}

.consent-expediente-evidence-signature {
  margin-top: 10px;
}

.consent-expediente-evidence-signature img {
  display: block;
  max-width: 100%;
  max-height: 160px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #ffffff;
}

body.is-mobile .consent-expediente-evidence-row {
  grid-template-columns: 1fr;
  gap: 2px;
}

@media (max-width: 900px) {
  .eecc-period-header-layout {
    flex-wrap: wrap;
  }

}

@media (max-width: 640px) {
  .eecc-account-row {
    max-width: none;
  }

  .eecc-period-header-layout {
    align-items: center;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 10px;
  }

  .eecc-period-file-content {
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .eecc-period-file-actions {
    justify-content: flex-start;
  }

  .eecc-period-file-replace {
    flex: 0 1 auto;
    justify-content: center;
  }

  .eecc-table-section-toolbar {
    justify-content: stretch;
  }

  .eecc-auto-conciliar-btn {
    width: 100%;
  }

  .eecc-period-file-viewer-frame {
    min-height: 320px;
    height: 52vh;
  }

  .eecc-metric-card-value {
    font-size: 24px;
  }

  .eecc-metric-card {
    width: 100%;
    min-width: 0;
  }

  .eecc-metric-card-progress {
    width: fit-content;
  }

  .eecc-metric-progress-line {
    gap: 8px;
  }

  .eecc-manual-row {
    grid-template-columns: 1fr;
  }

  .eecc-manual-row-nuevo-fields {
    grid-template-columns: 1fr;
  }

  .eecc-manual-field-monto {
    width: 100%;
    max-width: none;
    min-width: 0;
  }

  .eecc-mapping-actions .icon-button,
  .toolbar-actions.eecc-mapeo-inline-actions button,
  .eecc-period-header button {
    min-height: 44px;
  }
}

.eecc-view {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.eecc-view-header h1,
.eecc-period-header h2 {
  margin: 0 0 4px;
}

.eecc-notifications[hidden] {
  display: none;
}

.eecc-account-row {
  max-width: none;
}

.eecc-filters-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-items: end;
}

@media (max-width: 900px) {
  .eecc-filters-row {
    grid-template-columns: 1fr;
  }
}

body.is-mobile .eecc-filters-row {
  grid-template-columns: 1fr;
}

.eecc-filters-row .field {
  min-width: 0;
}

.eecc-account-row .field > label {
  font-size: 12px;
}

.eecc-workspace {
  display: block;
  margin-top: 20px;
}

.eecc-period-empty h2{
  margin-top:0;
}

.eecc-period-detail {
  min-width: 0;
}

.eecc-empty-state {
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.eecc-period-empty,
.eecc-table-section,
.eecc-period-header {
  padding: 14px;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  background: #ffffff;
}

.eecc-period-header {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 12px;
}

.eecc-period-header-layout {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
}

.eecc-period-header-icon {
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: #eff6ff;
  color: #2563eb;
}

.eecc-period-header-icon svg {
  width: 28px;
  height: 28px;
}

.eecc-period-header-main {
  min-width: 0;
  flex: 1;
}

.eecc-period-header-main h2 {
  margin: 0;
}

.eecc-period-file-replace {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 34px;
  padding: 8px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #fff;
  color: #4b5563;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.eecc-period-file-replace:hover {
  border-color: #bfdbfe;
  color: #2563eb;
  background: #f8fafc;
}

.eecc-period-action-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.eecc-period-action-icon svg {
  width: 16px;
  height: 16px;
}

.eecc-period-file-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  margin-top: 0;
}

.eecc-period-file-status {
  margin: 0;
  font-size: 13px;
  color: #6b7280;
}

.eecc-period-file-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.eecc-period-file-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.eecc-period-file-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.eecc-period-file-name {
  font-size: 13px;
  color: #4b5563;
  min-width: 0;
}

.eecc-period-file-line {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex-wrap: wrap;
}

.eecc-period-file-type-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #2563eb;
  flex-shrink: 0;
}

.eecc-period-file-type-icon svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

.eecc-period-file-preview-link,
.eecc-period-file-download-link {
  border: 0;
  background: transparent;
  padding: 0;
  font: inherit;
  font-size: 13px;
  color: #111827;
  text-decoration: none;
  cursor: pointer;
  min-width: 0;
  text-align: left;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.eecc-period-file-preview-link:hover,
.eecc-period-file-download-link:hover {
  color: #2563eb;
  text-decoration: none;
}

.eecc-period-file-preview-link.is-active {
  color: #2563eb;
  font-weight: 600;
}

.eecc-period-file-viewer {
  margin-top: 10px;
  width: 100%;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  overflow: hidden;
  background: #f9fafb;
}

.eecc-period-file-viewer[hidden] {
  display: none !important;
}

.eecc-period-file-viewer-frame {
  display: block;
  width: 100%;
  min-height: 420px;
  height: 62vh;
  max-height: 720px;
  border: 0;
  background: #fff;
}

.eecc-period-file-viewer-image {
  display: block;
  width: 100%;
  height: auto;
  max-height: 720px;
  object-fit: contain;
  background: #fff;
}

.eecc-period-file-viewer-fallback {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
}

.eecc-period-file-viewer-fallback-text {
  margin: 0;
  font-size: 13px;
  color: #4b5563;
}

.eecc-period-file-viewer-fallback-actions {
  width: 100%;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.eecc-period-file-delete {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid #fecaca;
  background: #fff;
  color: #dc2626;
  cursor: pointer;
  border-radius: 10px;
}

.eecc-period-file-delete svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

.eecc-period-file-delete:hover {
  color: #b91c1c;
  background: #fef2f2;
}

.eecc-period-file-load {
  flex-shrink: 0;
}

.eecc-period-file-missing {
  font-size: 12px;
  color: #b42318;
}

.eecc-period-file-checking {
  font-size: 12px;
  color: #6b7280;
}

.eecc-reemplazo-upload {
  margin-top: 14px;
  margin-bottom: 4px;
}

.eecc-reemplazo-upload-inner {
  padding: 14px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #f9fafb;
}

.eecc-table-section + .eecc-table-section {
  margin-top: 14px;
}

.eecc-table-section.is-collapsible {
  padding: 0;
  overflow: hidden;
}

.eecc-table-section-head {
  border-bottom: 1px solid #eef2f7;
}

.eecc-table-section-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 14px 16px;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
  color: inherit;
  font: inherit;
}

.eecc-table-section-toggle-text {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.eecc-table-section-title {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
}

.eecc-table-section-summary {
  font-size: 13px;
  color: #6b7280;
  line-height: 1.4;
}

.eecc-table-section-chevron {
  flex-shrink: 0;
  font-size: 18px;
  line-height: 1;
  color: #6b7280;
  transition: transform 0.15s ease;
}

.eecc-table-section.is-collapsed .eecc-table-section-chevron {
  transform: rotate(-90deg);
}

.eecc-table-section-metrics {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 12px;
  padding: 14px 16px 16px;
}

.eecc-metric-card {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 0 0 auto;
  width: auto;
  min-width: 168px;
  padding: 14px;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  background: #fff;
}

.eecc-metric-card-progress {
  align-items: center;
  min-width: 0;
  width: fit-content;
}

.eecc-metric-card-progress-head {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.eecc-metric-icon {
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
}

.eecc-metric-icon svg {
  width: 20px;
  height: 20px;
}

.eecc-metric-icon-detected {
  background: #eff6ff;
  color: #2563eb;
}

.eecc-metric-icon-reconciled {
  background: #ecfdf5;
  color: #059669;
}

.eecc-metric-progress-ring {
  position: relative;
  flex-shrink: 0;
  width: 50px;
  height: 50px;
}

.eecc-metric-progress-ring svg {
  width: 50px;
  height: 50px;
  transform: rotate(-90deg);
}

.eecc-metric-progress-track,
.eecc-metric-progress-value {
  fill: none;
  stroke-width: 3.2;
}

.eecc-metric-progress-track {
  stroke: #ddd6fe;
}

.eecc-metric-progress-value {
  stroke: #7c3aed;
  stroke-linecap: round;
  transition: stroke-dashoffset 0.2s ease;
}

.eecc-metric-progress-percent {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  color: #6d28d9;
}

.eecc-metric-card-body {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.eecc-metric-card-progress .eecc-metric-card-body {
  align-content: center;
}

.eecc-metric-card-label {
  font-size: 12px;
  color: #6b7280;
  line-height: 1.35;
}

.eecc-metric-card-value {
  font-size: 28px;
  line-height: 1;
  color: #111827;
}

.eecc-metric-card-detected .eecc-metric-card-value {
  color: #2563eb;
}

.eecc-metric-card-reconciled .eecc-metric-card-value {
  color: #059669;
}

.eecc-metric-card-value-inline {
  font-size: 22px;
  white-space: nowrap;
}

.eecc-metric-progress-line {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.eecc-table-section-operational {
  border-top: 1px solid #eef2f7;
}

.eecc-table-section.is-collapsed .eecc-table-section-operational {
  display: none;
}

.eecc-table-section-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 16px;
}

.eecc-conciliar-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 14px;
  border-radius: 10px;
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #1d4ed8;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.eecc-conciliar-btn.primary,
.eecc-auto-conciliar-btn {
  border-color: #2563eb;
  background: #2563eb;
  color: #fff;
}

.eecc-conciliar-btn.primary:hover,
.eecc-auto-conciliar-btn:hover {
  border-color: #1d4ed8;
  background: #1d4ed8;
  color: #fff;
}

.eecc-conciliar-btn.secondary {
  border-color: #2563eb;
  background: #fff;
  color: #1d4ed8;
}

.eecc-conciliar-btn.secondary:hover {
  border-color: #1d4ed8;
  background: #eff6ff;
  color: #1d4ed8;
}

.eecc-manual-conciliar-btn {
  min-height: 34px;
  padding: 7px 18px;
  min-width: 158px;
}

.eecc-mapeo-inline-actions.toolbar-actions .eecc-manual-conciliar-btn {
  border: 1px solid #2563eb;
  background: #fff;
  color: #1d4ed8;
  box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.08);
  padding-left: 18px;
  padding-right: 18px;
}

.eecc-mapeo-inline-actions.toolbar-actions .eecc-manual-conciliar-btn:hover,
.eecc-mapeo-inline-actions.toolbar-actions .eecc-manual-conciliar-btn:focus-visible {
  border-color: #1d4ed8;
  background: #eff6ff;
  color: #1d4ed8;
}

.eecc-conciliar-btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.eecc-conciliar-btn-icon svg {
  width: 16px;
  height: 16px;
}

.eecc-auto-conciliar-btn .eecc-conciliar-btn-icon svg {
  width: 17px;
  height: 17px;
}

.eecc-mapeo-inline-actions .eecc-conciliar-btn {
  width: 100%;
}

.eecc-table-section-actions {
  padding: 0 14px 10px;
}

.eecc-table-section.is-collapsed .eecc-table-section-actions {
  display: none;
}

.eecc-table-section-body {
  padding: 0 16px 16px;
}

.eecc-table-section-body .clientes-cards.eecc-lineas-cards {
  margin-top: 0;
}

.eecc-table-section-body .eecc-lineas-empty {
  margin-top: 0;
}

.eecc-linea-card .cliente-card-header {
  margin-bottom: 8px;
}

.eecc-linea-card .cliente-card-nombre {
  font-size: 15px;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  white-space: normal;
}

.eecc-linea-card-meta,
.eecc-linea-card-meta .cliente-card-meta-value {
  color: #64748b;
}

.eecc-linea-card-meta .cliente-card-meta-icon {
  color: #94a3b8;
}

.eecc-linea-card-meta .cliente-card-meta-icon svg {
  color: #94a3b8;
}

.eecc-linea-card-meta.venta-card-row-fecha {
  margin-top: 6px;
}

.eecc-linea-card-meta.venta-card-row-fecha:first-of-type {
  margin-top: 0;
}

.eecc-linea-card--pending {
  background: #fffbeb;
}

.eecc-linea-card-mapeo {
  margin-top: 10px;
}

.eecc-linea-card-mapeo .eecc-mapping-pending,
.eecc-linea-card-mapeo .eecc-mapping-confirmed {
  width: 100%;
  box-sizing: border-box;
}

.eecc-linea-card-mapeo .eecc-mapping-actions {
  justify-content: flex-start;
}

.eecc-table-section .table-responsive table {
  table-layout: fixed;
  width: 100%;
}

.eecc-table-section .table-responsive thead th,
.eecc-table-section .table-responsive tbody td {
  box-sizing: border-box;
  vertical-align: middle;
}

.eecc-mapeo-inline-actions.toolbar-actions {
  justify-content: flex-start;
  flex-wrap: wrap;
  min-width: 0;
  width: 100%;
}

.eecc-table-section .eecc-mapping-cell {
  overflow: visible;
  white-space: normal;
}

.eecc-table-section .eecc-conciliacion-col {
  width: 170px;
  min-width: 170px;
  max-width: 170px;
}

.eecc-mapping-pending,
.eecc-mapping-pending-row .eecc-mapping-cell {
  background: #fef3c7;
}

.eecc-mapping-pending {
  padding: 8px;
  border-radius: 10px;
  border: 1px solid #facc15;
}

.eecc-mapping-text {
  margin-bottom: 6px;
  font-weight: 700;
  color: #78350f;
}

.eecc-mapping-actions,
.eecc-manual-actions {
  gap: 8px;
  flex-wrap: wrap;
}

.eecc-transaction-summary {
  margin-bottom: 14px;
}

.eecc-manual-rows {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.eecc-manual-row {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr) minmax(160px, 1fr) auto;
  gap: 10px;
  align-items: end;
  padding: 10px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #f9fafb;
}

.eecc-manual-row[data-tipo="existente"],
.eecc-manual-row[data-tipo="nuevo"] {
  display: block;
}

.eecc-mapeo-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 10px;
  row-gap: 10px;
  align-items: center;
}

.eecc-mapeo-card-header {
  display: contents;
}

.eecc-mapeo-card-tipo {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  margin: 0;
}

.eecc-mapeo-card-tipo .combo-select {
  width: 100%;
}

.eecc-mapeo-card-header > .icon-button {
  grid-column: 2;
  grid-row: 1;
  flex-shrink: 0;
}

.eecc-mapeo-card .eecc-manual-row-body {
  grid-column: 1;
  grid-row: 2;
  min-width: 0;
}

.eecc-mapeo-card .eecc-manual-field-ingreso {
  min-width: 0;
  margin: 0;
}

.eecc-manual-row-nuevo-fields {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr) 100px;
  gap: 10px;
  align-items: end;
}

.eecc-manual-field-monto {
  width: 100px;
  max-width: 100px;
  min-width: 0;
}

.eecc-manual-field-monto .money-input-wrapper,
.eecc-manual-field-monto .amount-input {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.eecc-manual-field-ingreso {
  min-width: 0;
}

#eeccMapeoIngresoDialog .eecc-manual-row .combo-select,
#eeccMapeoEgresoDialog .eecc-manual-row .combo-select {
  width: 100%;
}

.combo-select-dropdown.combo-select-dropdown-floating {
  position: fixed;
  z-index: 10040;
}

.time-picker-am-pm .combo-select-dropdown.combo-select-dropdown-floating {
  min-width: 0;
  box-sizing: border-box;
}

.time-picker-am-pm .combo-select-dropdown .combo-select-option,
.time-picker-am-pm .combo-select-dropdown .combo-select-empty {
  text-align: center;
  padding: 8px 2px;
}

.eecc-upload-stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  max-width: 520px;
  margin: 0 auto;
  width: 100%;
}

.eecc-upload-stack .config-logo-dropzone {
  width: 100%;
}

.eecc-upload-stack .eecc-upload-actions {
  justify-content: center;
  width: 100%;
}

.eecc-upload-stack .eecc-upload-actions[hidden] {
  display: none !important;
}

.menu button {
  width: 100%;
  min-height: 38px;
  padding: 10px 12px;
  margin: 0;
  border: none;
  background: transparent;
  color: #B8C7DC;
  cursor: pointer;
  text-align: left;
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 12px;
  font-weight: 400;
  white-space: nowrap;
}

.menu button:hover {
  background: rgba(37, 99, 235, 0.18);
  color: #FFFFFF;
}

.menu button.menu-active {
  background: #2563EB;
  color: #FFFFFF;
  box-shadow: none;
}

.menu-icon {
  width: 18px;
  height: 18px;
  min-width: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: currentColor;
}

.menu-icon svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.menu-label {
  overflow: hidden;
  text-overflow: ellipsis;
}

.menu-version {
  margin-top: auto;
  padding: 0;
  border: none;
  border-radius: 0;
  background: none;
  font-size: 11px;
  line-height: 1.35;
  color: rgba(184, 199, 220, 0.75);
  word-break: break-word;
}

.app-main {
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--app-bg-tint);
  overscroll-behavior-x: none;
}

.menu-toggle {
  border: none;
  background: transparent;
  color: #111827;
  width: 30px;
  height: 30px;
  min-width: 30px;
  flex-shrink: 0;
  border-radius: 8px;
  font-size: 16px;
  cursor: pointer;
}

body.is-menu-pinned .menu-toggle {
  background: #e5e7eb;
}

.mobile-topbar-title {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  font-weight: bold;
  color: #111827;
}

.breadcrumb-item {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  border: none;
  background: transparent;
  color: #111827;
  cursor: pointer;
  padding: 2px 0;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}

.breadcrumb-item:hover {
  color: #2563eb;
  text-decoration: underline;
}

.breadcrumb-current {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #111827;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}

.breadcrumb-separator {
  flex: 0 0 auto;
  color: #111827;
  font-size: 14px;
  white-space: nowrap;
}

.header-paciente-search {
  margin: 0;
  flex: 0 0 36px;
  width: 36px;
  min-width: 0;
  max-width: 200px;
  overflow: hidden;
  transition: flex-basis 0.2s ease, max-width 0.2s ease;
}

.header-paciente-search.is-expanded {
  flex: 0 1 200px;
  width: auto;
  min-width: 36px;
  max-width: 200px;
  overflow: visible;
}

.header-paciente-search .field.full {
  position: relative;
  margin: 0;
  min-width: 0;
  max-width: 100%;
}

.header-paciente-search .field.full input[type="text"] {
  width: 100%;
  height: 36px;
  box-sizing: border-box;
  border: 1px solid var(--app-card-list-border);
  border-radius: var(--control-radius);
  background-color: #ffffff;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
  font-size: 13px;
  cursor: pointer;
}

.header-paciente-search:not(.is-expanded) .field.full input[type="text"] {
  padding: 0;
  color: transparent;
  caret-color: transparent;
}

.header-paciente-search.is-expanded .field.full input[type="text"] {
  padding: 8px 12px 8px 36px;
  cursor: text;
  color: inherit;
  caret-color: auto;
}

.header-paciente-search .field.full input[type="text"]:focus {
  outline: none;
  border-color: var(--app-card-list-border);
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}

.header-paciente-search-lupa-hit {
  position: absolute;
  z-index: 2;
  border: none;
  background: transparent;
  color: #111827;
  cursor: pointer;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.header-paciente-search:not(.is-expanded) .header-paciente-search-lupa-hit {
  inset: 0;
}

.header-paciente-search.is-expanded .header-paciente-search-lupa-hit {
  left: 0;
  top: 0;
  width: 36px;
  height: 36px;
}

.header-paciente-search-lupa-hit svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

.header-paciente-search-lupa-hit:hover {
  color: #374151;
}

.header-paciente-search .field.full input[type="text"]::placeholder {
  color: #94a3b8;
}

.header-paciente-search-dropdown {
  position: fixed;
  top: auto;
  right: auto;
  left: auto;
  width: 200px;
  max-width: min(200px, calc(100vw - 16px));
  background: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
  max-height: min(50vh, 320px);
  overflow-y: auto;
  z-index: 1300;
  display: none;
}

.header-paciente-search-dropdown.visible {
  display: block;
}

.header-paciente-search-dropdown .combo-select-option {
  padding: 11px 10px;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.header-session-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.header-mobile-actions {
  position: relative;
  display: none;
}

.header-mobile-menu-toggle {
  width: 34px;
  height: 34px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 999px;
  background: transparent;
  color: #111827;
  cursor: pointer;
}

.header-mobile-menu-toggle:hover {
  background: transparent;
}

.header-mobile-menu-toggle svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.header-mobile-actions-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 190px;
  display: none;
  flex-direction: column;
  padding: 8px;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 14px 26px rgba(15, 23, 42, 0.14);
  z-index: 1300;
}

.header-mobile-actions.is-open .header-mobile-actions-menu {
  display: flex;
}

.header-mobile-action-button {
  border: none;
  background: transparent;
  color: #111827;
  padding: 10px 12px;
  text-align: left;
  border-radius: 8px;
  cursor: pointer;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 9px;
}

.header-mobile-action-button:hover {
  background: #f3f4f6;
}

.header-mobile-action-button:disabled {
  color: #6b7280;
  cursor: default;
  opacity: 0.65;
}

.header-mobile-action-button:disabled:hover {
  background: transparent;
}

.header-mobile-action-button svg {
  width: 16px;
  height: 16px;
  min-width: 16px;
  fill: currentColor;
}

.auth-user-summary {
  position: relative;
  min-width: 0;
  text-align: right;
}

.auth-user-name {
  display: none;
  max-width: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 300;
  color: #111827;
}

.auth-user-trigger {
  display: inline-flex;
  width: 34px;
  height: 34px;
  padding: 0;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 999px;
  background: #475569;
  color: #ffffff;
  cursor: default;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  user-select: none;
}

.auth-user-trigger:hover {
  background: #334155;
}

.auth-user-summary::after {
  content: '';
  position: absolute;
  top: 100%;
  right: 0;
  width: 100%;
  min-width: 34px;
  height: 10px;
}

.auth-user-popover {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  max-width: min(280px, calc(100vw - 24px));
  padding: 10px 12px;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  background: #ffffff;
  color: #111827;
  box-shadow: 0 14px 26px rgba(15, 23, 42, 0.14);
  font-size: 12px;
  font-weight: 400;
  overflow: visible;
  white-space: normal;
  text-align: left;
  z-index: 1300;
  min-width:200px;
}

.auth-user-popover-name {
  font-weight: 700;
  line-height: 1.35;
  word-break: break-word;
}

.auth-user-popover-email {
  margin-top: 4px;
  color: #6b7280;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.35;
  word-break: break-all;
}

.auth-user-summary:hover .auth-user-popover {
  display: block;
}

.icon-only-button {
  width: 36px;
  height: 36px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 8px;
  cursor: pointer;
}

.icon-only-button svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.header-session-actions .secondary {
  background: #e5e7eb;
  color: #111827;
}

.header-session-actions .secondary:hover {
  background: #d1d5db;
}

.header-session-actions .secondary:disabled {
  opacity: 0.55;
  cursor: default;
}

/* Campana aún deshabilitada (sin flujo activo): no atenuar el icono. */
.header-session-actions #btnHeaderNotifications.secondary:disabled {
  opacity: 1;
}

.header-session-actions .secondary:disabled:hover {
  background: #e5e7eb;
}

#btnHeaderNotifications,
#btnHeaderNotifications:hover,
#btnHeaderLogout,
#btnHeaderLogout:hover {
  background: transparent;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.content {
  display: flex;
  flex-direction: column;
  flex: 1 1 0%;
  padding: 0;
  box-sizing: border-box;
  min-width: 0;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior-x: none;
  background: #f9fafb;
}

.pull-refresh-indicator {
  position: fixed;
  top: 58px;
  left: 0;
  right: 0;
  z-index: 1080;
  display: none;
  justify-content: center;
  pointer-events: none;
  opacity: 0;
  transform: translateY(-18px);
  transition: opacity 0.18s ease, transform 0.18s ease;
}

body.is-mobile .pull-refresh-indicator {
  display: flex;
}

.pull-refresh-indicator.visible {
  opacity: 1;
}

.pull-refresh-indicator-card {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(37, 99, 235, 0.16);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.96);
  color: #2563eb;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.14);
}

.pull-refresh-icon {
  width: 24px;
  height: 24px;
  fill: currentColor;
  transition: transform 0.18s ease;
}

.pull-refresh-indicator.ready .pull-refresh-icon {
  transform: rotate(180deg);
}

.pull-refresh-indicator.refreshing .pull-refresh-icon {
  animation: girar 0.8s linear infinite;
}

.card {
  background: transparent;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  max-width: 800px;
  width: 100%;
  box-sizing: border-box;
}

.card.full-width {
  max-width: none;
  flex: 1 1 0%;
  min-height: var(--app-main-min-height);
  border-radius: 0;
}

.content > .card.full-width:not(.form-card) {
  background: transparent;
  box-shadow: none;
}

.card.full-width.form-card {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 0%;
}

.card.full-width.form-card > .form-actions-sticky {
  margin-top: auto;
  flex-shrink: 0;
  padding: 12px 20px 12px 20px;
}

.card.full-width.form-card > .config-layout {
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  overflow: auto;
}

/*
  Configuración: sin scroll interno en el grid; el área principal (.content) hace scroll.
  Así los desplegables de combos filtrables (position:absolute) no quedan recortados por este layout.
*/
#vistaConfiguracion.card.full-width.form-card > .config-layout {
  overflow: visible;
}

/*
  Pie de formulario al borde inferior del área útil (junto al visor), incluso con poco contenido.
  Solo vistas bajo .content; modales clínicos quedan fuera y siguen con sticky.
*/
/*
  Sin flex:1 en el card, el formulario largo no estira el scroll de .content y el
  pie queda fuera del flujo (fixed): el final del presupuesto quedaba tapado.
  flex: none + min-height mantiene el panel alto cuando el contenido es corto.
*/
.content > .card.full-width.form-card {
  flex: 0 0 auto;
  width: 100%;
  min-height: var(--app-main-min-height);
  padding-bottom: var(--form-footer-reserve);
}

.content > .card.full-width:not(.form-card) {
  flex: 0 0 auto;
  width: 100%;
  min-width: 0;
  min-height: var(--app-main-min-height);
}

/*
  Pie fijo al borde real del viewport; el safe area va como padding-bottom
  para que el fondo tape el scroll (evita franja transparente en PWA iOS).
*/
.content .card.full-width.form-card .form-actions-sticky {
  position: fixed;
  left: 220px;
  right: 0;
  bottom: 0;
  z-index: 920;
  margin-top: 0;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 0;
  box-sizing: border-box;
  padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
}

body.is-menu-collapsed .content .card.full-width.form-card .form-actions-sticky,
body.is-compact:not(.is-mobile):not(.is-menu-open) .content .card.full-width.form-card .form-actions-sticky {
  left: var(--menu-collapsed-width);
}

body.is-mobile .content .card.full-width.form-card .form-actions-sticky {
  left: 0;
}

.form-actions-sticky {
  position: sticky;
  bottom: 0;
  z-index: 30;
  margin-top: 20px;
  margin-left: -25px;
  margin-right: -25px;
  margin-bottom: 0;
  padding: 14px 25px;
  background: #ffffff;
  backdrop-filter: blur(6px);
  border-top: 1px solid #e5e7eb;
  box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.04);
}

.form-actions-sticky::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  background: #ffffff;
}

#vistaInicio.dashboard-home-view {
  display: flex;
  flex-direction: column;
  min-height: var(--app-main-min-height);
  border-radius: 0;
  box-shadow: none;
  background:
    radial-gradient(circle at top left, rgba(37, 99, 235, 0.12), transparent 34%),
    linear-gradient(135deg, #dff0e8 0%, #f3f8fb 48%, #eaf1ed 100%);
}

.dashboard-home-body {
  flex: 1 1 auto;
  min-width: 0;
}

.dashboard-home-footer {
  position: fixed;
  left: 220px;
  right: 0;
  bottom: 0;
  z-index: 910;
  box-sizing: border-box;
  padding: 8px 20px calc(8px + env(safe-area-inset-bottom, 0px));
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(6px);
  border-top: 1px solid #e5e7eb;
  box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.04);
}

.dashboard-home-footer.is-hidden {
  display: none;
}

body:not(.is-mobile) .dashboard-home-footer {
  display: none;
}

body.is-menu-collapsed .dashboard-home-footer,
body.is-compact:not(.is-mobile):not(.is-menu-open) .dashboard-home-footer {
  left: var(--menu-collapsed-width);
}

body.is-mobile .dashboard-home-footer {
  left: 0;
}

.dashboard-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.dashboard-quick-actions {
  display: flex;
  align-items: stretch;
  gap: 10px;
  flex-wrap: nowrap;
  justify-content: center;
  width: 100%;
  margin-bottom: 0;
  min-width: 0;
}

.dashboard-quick-action {
  cursor: pointer;
  flex: 1 1 0;
  min-width: 0;
  max-width: 250px;
  min-height: 52px;
  padding: 6px 8px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 16px;
  background: #ffffff;
  color: inherit;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  text-align: left;
}

.dashboard-quick-action-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: #eff6ff;
  color: #2563eb;
}

.dashboard-quick-action-icon svg {
  width: 22px;
  height: 22px;
  display: block;
  flex-shrink: 0;
}

.dashboard-quick-action-copy {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.dashboard-quick-action-title {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25;
  color: #111827;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-quick-action-chevron {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 16px;
  width: 16px;
  color: #9ca3af;
}

.dashboard-quick-action-chevron svg {
  width: 16px;
  height: 16px;
  display: block;
}

.dashboard-quick-action:hover {
  background: #f8fafc;
  border-color: rgba(37, 99, 235, 0.22);
}

body.is-mobile .dashboard-quick-action {
  flex: 0 1 90px;
  max-width: 90px;
  min-height: 0;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  padding: 8px 8px 10px;
  text-align: center;
}

body.is-mobile .dashboard-quick-action-copy {
  align-items: center;
  width: 100%;
}

body.is-mobile .dashboard-quick-action-title {
  font-size: 11px;
  white-space: normal;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow-wrap: anywhere;
  word-break: break-word;
}

body.is-mobile .dashboard-quick-action-chevron {
  display: none;
}

body.is-mobile #vistaInicio.dashboard-home-view {
  --home-footer-reserve: calc(108px + env(safe-area-inset-bottom, 0px));
  padding-bottom: var(--home-footer-reserve);
}

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.dashboard-widget {
  min-height: 132px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 14px;
  padding: 16px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.08);
  box-sizing: border-box;
}

.dashboard-widget-small {
  grid-column: span 1;
}

.dashboard-widget-medium {
  grid-column: span 1;
}

.dashboard-widget-large {
  grid-column: span 1;
}

.dashboard-widget-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
  color: #374151;
  font-size: 13px;
  font-weight: 700;
}

.dashboard-widget-main-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 10px;
  min-width: 0;
  max-width: 100%;
  width: 100%;
  overflow: hidden;
}

.dashboard-widget-kpi-num {
  flex: 0 0 auto;
}

.dashboard-widget-chart-slot {
  flex: 1 1 0%;
  min-width: 0;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.dashboard-widget-value {
  color: #111827;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.1;
  white-space: nowrap;
}

.dashboard-widget-sparkline {
  box-sizing: border-box;
  flex: 0 1 auto;
  width: min(100%, 100px);
  height: 40px;
  overflow: hidden;
}

.dashboard-widget-sparkline svg {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
}

.dashboard-widget-sparkline svg circle {
  outline: none;
}

.dashboard-widget-sparkline .spark-hit-area {
  cursor: default;
  fill: rgba(0, 0, 0, 0);
  stroke: none;
}

.dashboard-widget-sparkline .spark-dot {
  outline: none;
}

.dashboard-spark-tooltip {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 12050;
  max-width: 240px;
  padding: 6px 10px;
  border-radius: 8px;
  background: rgba(17, 24, 39, 0.95);
  color: #ffffff;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.25);
  pointer-events: none;
}

.dashboard-spark-tooltip.is-visible {
  display: block;
}

.dashboard-widget-sparkline--empty {
  flex: 0 1 auto;
  width: min(100%, 100px);
  min-height: 40px;
  height: 40px;
  opacity: 0.35;
  border-radius: 8px;
  background: linear-gradient(180deg, #f3f4f6 0%, #e5e7eb 100%);
  box-sizing: border-box;
}

.dashboard-widget-note {
  margin-top: 8px;
  color: #6b7280;
  font-size: 12px;
  line-height: 1.45;
}

.dashboard-widget-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.dashboard-widget-list-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid #f3f4f6;
  color: #374151;
  font-size: 12px;
}

.dashboard-widget-list-row:last-child {
  border-bottom: none;
}

.dashboard-widget-list-title {
  font-weight: 700;
}

.dashboard-widget-list-meta {
  margin-top: 2px;
  color: #6b7280;
}

.dashboard-widget-list-value {
  color: #111827;
  font-weight: 700;
  white-space: nowrap;
}

.dashboard-chart-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.dashboard-chart-metric {
  padding: 10px;
  border-radius: 10px;
  background: #eef2ff;
}

.dashboard-chart-label {
  display: block;
  color: #6b7280;
  font-size: 11px;
  font-weight: 700;
}

.dashboard-chart-value {
  display: block;
  margin-top: 4px;
  color: #111827;
  font-size: 15px;
  font-weight: 700;
}

.dashboard-empty {
  padding: 18px;
  border: 1px dashed #d1d5db;
  border-radius: 12px;
  color: #6b7280;
  background: #f9fafb;
}

.skeleton {
  position: relative;
  overflow: hidden;
  background: #e5e7eb;
  border-radius: 999px;
}

.skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.65), transparent);
  animation: skeleton-shimmer 1.25s ease-in-out infinite;
}

.skeleton-line {
  display: block;
  width: 100%;
  height: 14px;
}

.skeleton-line.short {
  width: 48%;
}

.skeleton-line.medium {
  width: 68%;
}

.skeleton-line.long {
  width: 88%;
}

.skeleton-table table {
  table-layout: fixed;
}

.skeleton-table th,
.skeleton-table td {
  box-sizing: border-box;
  height: 37px;
  min-height: 37px;
  vertical-align: middle;
}

.skeleton-table th {
  overflow: hidden;
}

.skeleton-card .cliente-card-header {
  padding-right: 38px;
}

.skeleton-card .cliente-card-campo {
  min-height: 18px;
}

.skeleton-flujo-caja-chart {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 180px;
  border-radius: 12px;
}

.skeleton-flujo-caja-anio {
  display: block;
  width: 100%;
  min-height: 36px;
  border-radius: var(--control-radius);
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-anio-field.is-skeleton select,
#panelFlujoCajaGastos .flujo-caja-gastos-grafico-anio-field.is-skeleton .combo-select {
  display: none !important;
}

.skeleton-eecc-conciliar-btn-skel {
  display: inline-block;
  width: 200px;
  height: 38px;
  border-radius: var(--control-radius);
}

.skeleton-eecc-metric-card {
  display: flex;
  align-items: center;
  gap: 10px;
}

.skeleton-eecc-section + .skeleton-eecc-section {
  margin-top: 16px;
}

.cliente-card-cliente.skeleton-card .skeleton-avatar-circle {
  width: 40px;
  height: 40px;
  min-width: 40px;
  border-radius: 999px;
  flex-shrink: 0;
}

.cliente-card-cliente.skeleton-card .cliente-card-menu-anchor {
  position: relative;
  top: auto;
  right: auto;
  flex: 0 0 auto;
  align-self: center;
}

.cliente-card-cliente.skeleton-card .skeleton-card-menu-skel {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: block;
}

.cliente-card-cliente.skeleton-card .skeleton-meta-ico-skel {
  width: 18px;
  height: 18px;
  min-width: 18px;
  border-radius: 6px;
  flex-shrink: 0;
}

.cliente-card-cliente.skeleton-card .cliente-card-meta-value {
  flex: 1 1 auto;
  min-width: 0;
}

.cliente-card-cliente.skeleton-card .cliente-card-meta-value .skeleton-line {
  display: block;
  max-width: 100%;
}

.cliente-card-cliente.skeleton-card .cliente-card-ventas-badge.cliente-card-ventas-badge--skeleton {
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  box-sizing: border-box;
}

.cliente-card-cliente.skeleton-card .skeleton-ventas-lbl-skel {
  height: 10px;
  width: 48px;
  margin: 0 auto;
  border-radius: 999px;
  display: block;
}

.cliente-card-cliente.skeleton-card .skeleton-ventas-val-skel {
  height: 14px;
  width: 56px;
  margin: 8px auto 0;
  border-radius: 999px;
  display: block;
}

.skeleton-card-servicio .skeleton-card-menu-skel {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: block;
}

.skeleton-card-servicio .skeleton-meta-ico-skel {
  width: 18px;
  height: 18px;
  min-width: 18px;
  border-radius: 6px;
  flex-shrink: 0;
}

.skeleton-presupuesto-card .skeleton-card-menu-skel {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: block;
}

.skeleton-presupuesto-card .skeleton-meta-ico-skel {
  width: 18px;
  height: 18px;
  min-width: 18px;
  border-radius: 6px;
  flex-shrink: 0;
}

.skeleton-presupuesto-card .presupuesto-card-row-estado .cliente-card-meta-line {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 0%;
  min-width: 0;
}

.skeleton-presupuesto-card .presupuesto-card-row-estado .cliente-card-meta-line .cliente-card-meta-value {
  flex: 1 1 auto;
  min-width: 0;
}

.skeleton-presupuesto-card .presupuesto-card-row-estado .cliente-card-meta-line .cliente-card-meta-value .skeleton-line {
  display: block;
  max-width: 100%;
}

.skeleton-presupuesto-card .presupuesto-card-cliente-block {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 0%;
  min-width: 0;
}

.skeleton-presupuesto-card .presupuesto-card-cliente-block .cliente-card-meta-value {
  flex: 1 1 auto;
  min-width: 0;
}

.skeleton-presupuesto-card .presupuesto-card-cliente-block .cliente-card-meta-value .skeleton-line {
  display: block;
  max-width: 100%;
}

.skeleton-presupuesto-card .skeleton-presupuesto-pill-skel {
  width: 76px;
  height: 26px;
  border-radius: 999px;
  flex-shrink: 0;
}

.skeleton-presupuesto-card .skeleton-presupuesto-monto-skel {
  width: 72px;
  height: 18px;
  border-radius: 8px;
  flex-shrink: 0;
}

.skeleton-presupuesto-card .presupuesto-card-row-fecha-monto .cliente-card-meta-value .skeleton-line {
  display: block;
  max-width: 100%;
}

.skeleton-venta-card .skeleton-card-menu-skel {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: block;
}

.skeleton-venta-card .skeleton-meta-ico-skel {
  width: 18px;
  height: 18px;
  min-width: 18px;
  border-radius: 6px;
  flex-shrink: 0;
}

.skeleton-venta-card .presupuesto-card-cliente-block {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 0%;
  min-width: 0;
}

.skeleton-venta-card .presupuesto-card-cliente-block .cliente-card-meta-value .skeleton-line {
  display: block;
  max-width: 100%;
}

.skeleton-venta-card .venta-card-row-fecha .cliente-card-meta-value .skeleton-line {
  display: block;
  max-width: 100%;
}

.skeleton-venta-card .venta-card-row-metric .cliente-card-meta-value .skeleton-line {
  display: block;
}

.skeleton-venta-card .skeleton-venta-metric-monto-skel {
  width: 72px;
  height: 18px;
  border-radius: 8px;
  flex-shrink: 0;
}

.skeleton-widget .dashboard-widget-title {
  margin-bottom: 14px;
}

.skeleton-widget .dashboard-widget-main-row .dashboard-widget-kpi-num {
  min-height: 31px;
}

.skeleton-widget .dashboard-widget-sparkline-placeholder {
  flex: 0 1 auto;
  box-sizing: border-box;
  width: min(100%, 100px);
  height: 36px;
  border-radius: 8px;
  background: #e5e7eb;
  overflow: hidden;
}

.skeleton-widget .dashboard-widget-value {
  min-height: 31px;
}

.skeleton-quick-action {
  flex: 1 1 0;
  min-width: 0;
  max-width: 200px;
  min-height: 52px;
  border-radius: 16px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

body.is-mobile .skeleton-quick-action {
  flex: 0 1 90px;
  max-width: 90px;
  min-height: 78px;
}

.field.catalog-loading {
  position: relative;
}

.field.catalog-loading select,
.field.catalog-loading .combo-select-input {
  color: transparent;
}

.field.catalog-loading .combo-select-input::placeholder {
  color: transparent;
  opacity: 1;
}

.field.catalog-loading::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  top: auto;
  bottom: 11px;
  height: 16px;
  border-radius: 999px;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    #e5e7eb 0%,
    #e5e7eb 36%,
    rgba(255, 255, 255, 0.72) 50%,
    #e5e7eb 64%,
    #e5e7eb 100%
  );
  background-size: 200% 100%;
  background-repeat: no-repeat;
  animation: catalog-loading-shimmer-bg 1.25s ease-in-out infinite;
}

@keyframes skeleton-shimmer {
  100% {
    transform: translateX(100%);
  }
}

@keyframes catalog-loading-shimmer-bg {
  0% {
    background-position: 100% 0;
  }
  100% {
    background-position: -100% 0;
  }
}

.dashboard-builder {
  display: none;
  margin-top: 18px;
  border-top: 1px solid #e5e7eb;
  padding-top: 18px;
}

.dashboard-builder.active {
  display: block;
}

.dashboard-builder-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 16px;
}

.dashboard-builder-section {
  display: grid;
  gap: 14px;
  margin-bottom: 18px;
}

.dashboard-builder-section-title {
  margin: 0;
  font-size: 17px;
  color: #111827;
}

.dashboard-builder-panel {
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 14px;
  background: #f9fafb;
}

.dashboard-builder-panel h2 {
  margin: 0 0 12px;
  font-size: 16px;
}

.dashboard-builder-list {
  display: grid;
  gap: 10px;
}

.dashboard-builder-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 12px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #ffffff;
}

.dashboard-builder-item[draggable="true"] {
  cursor: grab;
}

.dashboard-builder-item.is-dragging {
  opacity: 0.55;
}

.dashboard-drag-handle {
  color: #6b7280;
  font-weight: 700;
  letter-spacing: -2px;
  user-select: none;
}

.dashboard-builder-name {
  color: #111827;
  font-size: 13px;
  font-weight: 700;
}

.dashboard-builder-description {
  margin-top: 3px;
  color: #6b7280;
  font-size: 12px;
  line-height: 1.35;
}

.dashboard-builder-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.dashboard-builder-actions .secondary,
.dashboard-builder-actions .danger {
  min-height: 30px;
  padding: 6px 9px;
  font-size: 12px;
}

.table-sortable {
  cursor: pointer;
  user-select: none;
}

.table-sortable-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
}

.table-sortable-label {
  min-width: 0;
}

.table-sortable-indicator {
  flex: 0 0 20px;
  width: 20px;
  text-align: right;
  font-size: 9px;
  color: #111827;
  visibility: hidden;
}

.table-sortable.sort-asc .table-sortable-indicator,
.table-sortable.sort-desc .table-sortable-indicator,
.table-header-filter.sort-asc .table-sortable-indicator,
.table-header-filter.sort-desc .table-sortable-indicator {
  visibility: visible;
}

h1 {
  margin-top: 0;
  font-size: 24px;
  margin-bottom: 20px;
}

#tituloFormulario,
#tituloServicioFormulario,
#tituloPresupuestoFormulario,
#tituloVentaFormulario {
  display: none !important;
}

#camposIngresoTransaccion,
#camposEgresoTransaccion,
#camposEgresoDirectoTransaccion {
  margin-top: 15px;
}

.transaction-form-row {
  display: grid;
  gap: 15px;
  margin-top: 15px;
}

.transaction-form-row:first-of-type {
  margin-top: 0;
}

.transaction-form-row.three-columns {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.transaction-form-row.two-columns {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.transaction-form-row.one-column {
  grid-template-columns: minmax(0, 1fr);
}

.transaction-form-row-type-date-amount {
  box-sizing: border-box;
  grid-template-columns: minmax(0, 1fr) 130px 130px;
  max-width: 100%;
  min-width: 0;
  width: 100%;
}

.transaction-form-row-type-date-amount.has-comprobante-pago {
  grid-template-columns: minmax(0, 1fr) 130px 130px minmax(0, 1fr);
}

.transaction-field-tipo-wrap,
.transaction-field-tipo,
.transaction-field-fecha,
.transaction-field-monto,
.transaction-field-comprobante {
  min-width: 0;
}

.transaction-field-tipo .combo-select {
  width: 100%;
}

.transaction-field-fecha input[type="date"],
.transaction-field-monto input {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  width: 100%;
}

.transaction-field-monto .money-input-wrapper {
  min-width: 0;
  width: 100%;
}

#vistaTransaccionFormulario {
  min-width: 0;
  overflow-x: clip;
}

#vistaTransaccionFormulario .field > label {
  font-size: 12px;
}

.grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
}

#vistaServicioFormulario .service-form-grid {
  box-sizing: border-box;
  padding-inline-end: 30px;
  margin-bottom:30px;
}

.service-name-field {
  position: relative;
}

.service-form-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 132px;
  gap: 15px;
}

#vistaServicioFormulario .service-gastos-asociados-title {
  font-size: 13px;
}

.service-price-field {
  width: 132px;
  min-width: 132px;
  max-width: 132px;
}

.field {
  display: flex;
  flex-direction: column;
}

.field.full {
  grid-column: 1 / -1;
}

label {
  margin-bottom: 6px;
  font-weight: bold;
}

.required-marker {
  background: #fee2e2;
  border-radius: 999px;
  color: #991b1b;
  display: inline-block;
  font-size: 9px;
  font-weight: 400;
  line-height: 1;
  margin-left: 6px;
  padding: 4px 7px;
  vertical-align: middle;
}

#panelDatosCliente .field > label {
  font-size: 12px;
}

#panelDatosCliente .form-container {
  max-width: 1120px;
  width: 100%;
}

#panelDatosCliente .form-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 15px;
}

#panelDatosCliente [data-registro-campo="nombre"],
#panelDatosCliente [data-registro-campo="apellido"] {
  grid-column: span 4;
}

#panelDatosCliente [data-registro-campo="tipoDocumento"] {
  grid-column: 1 / span 3;
}

#panelDatosCliente [data-registro-campo="documento"],
#panelDatosCliente [data-registro-campo="fechaNacimiento"],
#panelDatosCliente [data-registro-campo="sexo"],
#panelDatosCliente [data-registro-campo="telefono"] {
  grid-column: span 3;
}

#panelDatosCliente [data-registro-campo="correo"] {
  grid-column: span 5;
}

#panelDatosCliente [data-registro-campo="distrito"] {
  grid-column: span 4;
}

#panelDatosCliente [data-registro-campo="direccion"] {
  grid-column: span 8;
}

#panelDatosCliente [data-registro-campo="pais"] {
  grid-column: span 4;
}

#panelDatosCliente .client-tags-field {
  grid-column: 1 / -1;
}

#panelDatosCliente #clienteCamposAdicionales {
  display: contents;
}

#panelDatosCliente [data-registro-campo-adicional] {
  grid-column: span 4;
}

.client-tags-field {
  position: relative;
}

.client-tag-suggestion {
  display: none;
  margin-top: 4px;
}

.client-tag-suggestion.visible {
  display: block;
}

.client-tag-suggestion button {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  color: #111827;
  cursor: pointer;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  padding: 8px 10px;
  width: 100%;
}

.client-tags-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.client-tags-chips-table {
  gap: 4px;
  margin-top: 0;
}

.client-tags-chips-table .client-tag-chip {
  font-size: 11px;
  padding: 4px 8px;
}

.client-tag-chip {
  align-items: center;
  border-radius: 999px;
  color: #ffffff;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
  padding: 6px 10px;
}

.client-tag-chip button {
  background: transparent;
  border: 0;
  color: rgba(255, 255, 255, 0.92);
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  padding: 0;
}

.client-tag-chip button:hover {
  color: #ffffff;
}

.table-filter-combo {
  position: relative;
}

.client-tags-filter-dropdown {
  min-width: 220px;
  right: 0;
}

.table-header-filter {
  cursor: pointer;
  position: relative;
  vertical-align: middle;
}

.table-header-filter-inner {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  width: 100%;
}

.table-header-filter-label {
  align-items: center;
  display: inline-flex;
  min-height: 22px;
  min-width: 0;
}

.table-header-filter-active-icon {
  align-items: center;
  color: #111827;
  display: inline-flex;
  flex: 0 0 16px;
  height: 16px;
  justify-content: center;
  width: 16px;
}

.table-header-filter-active-icon svg {
  display: block;
  height: 14px;
  width: 14px;
}

.table-header-filter-floating {
  background: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  box-shadow: 0 14px 26px rgba(15, 23, 42, 0.14);
  max-height: calc(100vh - 24px);
  max-width: min(360px, calc(100vw - 16px));
  min-width: 180px;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 4px 0;
  position: fixed;
  white-space: nowrap;
  width: fit-content;
  z-index: 13000;
}

.table-header-filter-floating .config-multi-option {
  align-items: center;
  background: #ffffff;
  color: #111827;
  display: flex;
  font-size: 13px;
  font-weight: 400;
  gap: 8px;
  line-height: 1.35;
  min-width: 0;
  padding: 8px 12px;
  width: 100%;
}

.table-header-filter-floating .config-multi-option input {
  flex: 0 0 auto;
}

.table-header-filter-floating .config-multi-option span {
  font-weight: 400;
  min-width: 0;
}

.table-header-filter-floating .config-multi-option:hover {
  background: #eff6ff;
  color: #1d4ed8;
}

.table-header-filter-floating-header {
  align-items: center;
  border-bottom: 1px solid #e5e7eb;
  display: flex;
  gap: 8px;
  padding: 8px 10px;
  position: sticky;
  top: 0;
  z-index: 1;
  background: #ffffff;
}

.table-header-filter-floating-title {
  color: #111827;
  flex: 1 1 auto;
  font-size: 13px;
  font-weight: 600;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.table-header-filter-floating-header-simple {
  justify-content: space-between;
}

.table-header-filter-floating-header-simple .table-header-filter-floating-title {
  flex: 1 1 auto;
}

.table-header-filter-back,
.table-header-filter-close {
  background: transparent;
  border: 0;
  color: #2563eb;
  cursor: pointer;
  flex-shrink: 0;
  font: inherit;
  font-size: 12px;
  padding: 4px 6px;
}

.table-header-filter-close {
  color: #6b7280;
  font-size: 18px;
  line-height: 1;
  padding: 2px 4px;
}

.table-header-filter-back:hover,
.table-header-filter-close:hover {
  color: #1d4ed8;
}

.table-header-filter-floating-body {
  max-height: inherit;
  overflow-x: hidden;
  overflow-y: auto;
}

.list-toolbar-more-menu {
  position: relative;
}

.toolbar-more-trigger {
  box-sizing: border-box;
  height: 36px;
  min-height: 36px;
  min-width: 36px;
  padding: 0;
  width: 36px;
}

.toolbar-more-trigger svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.toolbar-more-menu-dropdown {
  background: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  box-shadow: 0 14px 26px rgba(15, 23, 42, 0.14);
  display: none;
  flex-direction: column;
  gap: 0;
  max-height: calc(100vh - 24px);
  max-width: min(280px, calc(100vw - 16px));
  min-width: 220px;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 8px;
  position: fixed;
  white-space: nowrap;
  z-index: 13000;
}

.toolbar-more-menu-dropdown.is-open {
  display: flex;
}

.toolbar-more-menu-dropdown[hidden] {
  display: none !important;
}

.toolbar-actions .toolbar-more-menu-dropdown .toolbar-more-menu-action {
  background: transparent;
  border: none;
  border-radius: 8px;
  box-sizing: border-box;
  color: #111827;
  height: auto;
  min-height: 40px;
  padding: 10px 12px;
  width: 100%;
}

.toolbar-actions .toolbar-more-menu-dropdown .toolbar-more-menu-action:hover {
  background: #f3f4f6;
  color: #111827;
}

.toolbar-more-menu-dropdown .toolbar-more-menu-action {
  box-sizing: border-box;
  min-height: 40px;
  width: 100%;
}

.toolbar-more-menu-dropdown .toolbar-more-menu-action:hover {
  background: #f3f4f6;
  color: #111827;
}

.toolbar-more-menu-dropdown .toolbar-more-menu-action.is-pressed {
  background: #eff6ff;
  color: #1d4ed8;
}

.toolbar-more-menu-dropdown .toolbar-more-menu-action.is-pressed:hover {
  background: #dbeafe;
}

.toolbar-more-menu-dropdown .card-action-icon svg[fill='none']:not(.void-anular-icon) path {
  fill: none;
  stroke: currentColor;
}

.table-header-filter-option {
  display: block;
  width: 100%;
  min-height: 34px;
  padding: 8px 12px;
  border: 0;
  background: #ffffff;
  color: #111827;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  text-align: left;
  white-space: nowrap;
}

.table-header-filter-option:hover,
.table-header-filter-option.is-active {
  background: #eff6ff;
  color: #1d4ed8;
}

#recordatorioDialog .field > label,
#gastoFlujoCajaDialog .field > label,
#flujoCajaConfigDialog .field > label,
#reglaRecordatorioClienteDialog .field > label,
#vistaPresupuestoFormulario .field > label,
#vistaVentaFormulario .field > label,
#vistaTransaccionFormulario .field > label,
#vistaServicioFormulario .field > label,
#vistaConfiguracion .field > label,
#odontologoConfigDialog .field > label,
#empleadoConfigDialog .field > label,
#puestoTrabajoConfigDialog .field > label,
#eeccMapeoEgresoDialog .field > label,
#eeccMapeoIngresoDialog .field > label {
  font-size: 12px;
}

#eeccMapeoEgresoDialog .grid {
  margin-bottom: 20px;
}

#vistaConsentimientoInformadoFormulario .field > label {
  font-size: 12px;
}

input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: var(--control-radius);
  font-size: 14px;
  box-sizing: border-box;
  width: 100%;
  font-family: inherit;
}

input:disabled,
select:disabled,
textarea:disabled,
input[readonly],
textarea[readonly] {
  background: #f3f4f6;
  color: #6b7280;
  cursor: not-allowed;
  opacity: 1;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}

textarea {
  min-height: 96px;
  resize: vertical;
}

#notasInternasTransaccion {
  min-height: 40px;
  overflow: hidden;
  resize: none;
}

#notasServicio,
#notasVenta {
  min-height: 40px;
  height: 40px;
}

.combo-native-select {
  display: none;
}

.combo-select {
  position: relative;
  width: 100%;
  min-width: 0;
}

.combo-select:not(.is-disabled) {
  cursor: pointer;
}

.combo-select-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding-right: 35px;
  background: white;
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.combo-select:not(.is-disabled) .combo-select-input:focus {
  cursor: text;
}

.combo-select.is-combo-no-filter .combo-select-input,
.combo-select.is-combo-no-filter:not(.is-disabled) .combo-select-input:focus {
  cursor: pointer;
  background: white;
  color: #111827;
}

.combo-select.is-disabled .combo-select-input,
.combo-select.is-disabled .combo-select-toggle {
  cursor: not-allowed;
  opacity: 1;
}

.combo-select.is-disabled .combo-select-input {
  background: #f3f4f6;
  color: #6b7280;
}

.combo-select-toggle {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #111827;
  pointer-events: none;
  width: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  line-height: 1;
  z-index: 1;
}

.combo-select-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  bottom: auto;
  left: 0;
  right: 0;
  background: white;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
  max-height: min(50vh, 480px);
  overflow-y: auto;
  z-index: 60;
  display: none;
}

.combo-select-dropdown.visible {
  display: block;
}

.combo-select-dropdown.open-up {
  top: auto;
  bottom: calc(100% + 4px);
}

.combo-select-option {
  padding: 10px 12px;
  cursor: pointer;
  font-size: 14px;
}

.combo-select-option.is-selected {
  background: #eff6ff;
}

/* Evita resalte tipo hover en táctil al abrir el popup bajo el mismo punto (ignoreNextClick anula el click pero :hover sí pegaba). */
@media (hover: hover) and (pointer: fine) {
  .combo-select-option:hover {
    background: #eff6ff;
  }
}

.combo-select-empty {
  padding: 10px 12px;
  color: #111827;
  font-size: 14px;
}

.combo-select-option.combo-select-action {
  border-top: 1px solid #e5e7eb;
  color: #1d4ed8;
  font-weight: 700;
}

.service-similar-dropdown {
  max-height: 240px;
  padding: 10px 12px;
}

.service-similar-title {
  color: #111827;
  font-size: 14px;
  font-weight: 700;
  padding: 0 0 8px;
}

.service-similar-item {
  color: #374151;
  font-size: 14px;
  line-height: 1.45;
  padding: 2px 0;
  pointer-events: none;
}

.combo-mobile-popup-backdrop {
  position: fixed;
  inset: 0;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 24px 16px 16px;
  background: rgba(17, 24, 39, 0.42);
  z-index: 10030;
  box-sizing: border-box;
}

.combo-mobile-popup-backdrop.visible {
  display: flex;
}

.combo-mobile-popup {
  width: min(420px, calc(100vw - 32px));
  max-height: calc(100dvh - 40px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: white;
  border-radius: 14px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.18);
}

.combo-mobile-popup-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid #e5e7eb;
}

.combo-mobile-popup-title {
  min-width: 0;
  color: #111827;
  font-size: 16px;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.combo-mobile-popup-close {
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
  border: none;
  border-radius: 999px;
  background: #f3f4f6;
  color: #111827;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
  font-weight: 400;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.combo-mobile-popup-search {
  padding: 12px 16px;
  border-bottom: 1px solid #e5e7eb;
  background: white;
}

.combo-mobile-popup-options {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.combo-mobile-popup-options .combo-select-option,
.combo-mobile-popup-options .combo-select-empty {
  padding: 13px 16px;
  font-size: 15px;
}

.combo-mobile-popup-options .combo-select-option + .combo-select-option {
  border-top: 1px solid #f3f4f6;
}

.actions {
  margin-top: 20px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.actions button {
  padding: 12px 20px;
  border: none;
  border-radius: 6px;
  background: #2563eb;
  color: white;
  cursor: pointer;
  font-size: 14px;
}

#vistaPresupuestoFormulario .form-actions-sticky.actions button,
#vistaVentaFormulario .form-actions-sticky.actions button {
  align-items: center;
  display: inline-flex;
  justify-content: center;
  min-height: 42px;
  max-height: 48px;
  padding-bottom: 10px;
  padding-top: 10px;
}

/* Pies con clase .actions: el fill por defecto del SVG es negro; enlazar al color del botón (main.css siempre cargado; no depender de odontogram.css bajo demanda). */
.form-actions-sticky.actions button svg:not(.void-anular-icon) {
  fill: currentColor;
}

/* Footer Compartir presupuesto/consentimiento (antes solo en odontogram.css). */
#vistaPresupuestoFormulario .btn-presupuesto-compartir-footer,
#vistaConsentimientoInformadoFormulario .btn-presupuesto-compartir-footer {
  align-items: center;
  background: #0d9488;
  border: none;
  color: #fff;
  display: none;
  gap: 8px;
  justify-content: center;
}

#vistaPresupuestoFormulario .btn-presupuesto-compartir-footer:hover,
#vistaConsentimientoInformadoFormulario .btn-presupuesto-compartir-footer:hover {
  background: #0f766e;
  color: #fff;
}

#vistaPresupuestoFormulario .btn-presupuesto-compartir-footer .btn-presupuesto-compartir-footer__ico,
#vistaConsentimientoInformadoFormulario .btn-presupuesto-compartir-footer .btn-presupuesto-compartir-footer__ico {
  display: inline-flex;
  flex-shrink: 0;
}

#vistaPresupuestoFormulario .btn-presupuesto-compartir-footer .btn-presupuesto-compartir-footer__ico svg,
#vistaConsentimientoInformadoFormulario .btn-presupuesto-compartir-footer .btn-presupuesto-compartir-footer__ico svg {
  display: block;
  fill: currentColor;
  height: 18px;
  width: 18px;
}

#vistaPresupuestoFormulario .btn-presupuesto-footer-regresar .btn-presupuesto-footer-regresar__label-mobile,
#vistaVentaFormulario .btn-presupuesto-footer-regresar .btn-presupuesto-footer-regresar__label-mobile {
  display: none;
}

#consentPreviewTexto.consent-inline-preview {
  max-height: none;
  overflow: visible;
}

.actions button:hover {
  background: #1d4ed8;
}

.actions button.secondary {
  background: #6b7280;
}

.actions button.secondary:hover {
  background: #4b5563;
}

.actions button.danger {
  background: #dc2626;
}

.actions button.danger:hover {
  background: #b91c1c;
}

.actions button.success {
  background: #16a34a;
}

.actions button.success:hover {
  background: #15803d;
}

.message {
  margin-top: 15px;
  padding: 12px;
  border-radius: 6px;
  display: none;
}

#mensajeGlobal {
  margin: 0;
  pointer-events: auto;
  position: fixed;
  top: 0;
  /* Por debajo de .dialog-backdrop (10000), #appDialog (10020) y combo móvil (10030); por encima del cromado habitual; por debajo de .page-loading (11000). */
  z-index: 9990;
}

#mensajeGlobal.visible {
  display: block;
}

.message.visible {
  display: block;
}

#mensajeGlobal.success,
#mensajeGlobal.error {
  min-height: 52px;
  box-sizing: border-box;
  padding: 0 17px;
  border-radius: 0;
}

#mensajeGlobal.success .message-content,
#mensajeGlobal.error .message-content {
  min-height: 52px;
  align-items: center;
}

.message-content {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.message-text {
  flex: 1;
  line-height: 1.35;
}

.message-close {
  border: none;
  background: transparent;
  color: inherit;
  cursor: default;
  font-size: 18px;
  font-weight: bold;
  line-height: 1;
  padding: 0;
}

.success {
  background: #c4f7d6;
  color: #166534;
}

.error {
  background: #fee2e2;
  color: #991b1b;
}

.field-error {
  display: none;
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.35;
  color: #b91c1c;
}

.field-error.visible {
  display: block;
}

input.has-error {
  border-color: #dc2626;
  box-shadow: 0 0 0 1px rgba(220, 38, 38, 0.15);
}

table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin-top: 0;
  min-width: 720px;
  border: none;
  border-radius: 6px;
  background: white;
}

th, td {
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding: 4px 8px;
  text-align: left;
  vertical-align: middle;
  line-height: 1.1;
  min-height: 34px;
  height: auto;
  box-sizing: border-box;
  font-size: 12px;
}

th:last-child,
td:last-child {
  border-right: none;
}

tbody tr:last-child td {
  border-bottom: none;
}

th {
  background: #e0e6f3;
  padding: 8px 8px;
}

#tituloTransaccionFormulario {
  font-size: 18px;
}

.toolbar {
  margin-bottom: 20px;
}

.section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.toolbar-actions {
  display: flex;
  justify-content: flex-end;
}

.toolbar-buttons {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.toolbar-actions button {
  height: 36px;
  padding: 0 16px;
  border: none;
  border-radius: 6px;
  background: #2563eb;
  color: white;
  cursor: pointer;
}

.toolbar-actions button:hover {
  background: #1d4ed8;
}

.toolbar-actions.eecc-mapeo-inline-actions .eecc-manual-conciliar-btn {
  border: 1px solid #2563eb;
  background: #fff;
  color: #1d4ed8;
  padding-left: 10px;
  padding-right: 10px;
}

.toolbar-actions.eecc-mapeo-inline-actions .eecc-manual-conciliar-btn:hover,
.toolbar-actions.eecc-mapeo-inline-actions .eecc-manual-conciliar-btn:focus-visible {
  border-color: #1d4ed8;
  background: #eff6ff;
  color: #1d4ed8;
}

/* "+" de alta tipo Nuevo: tamaño cercano a mayúsculas del botón */
button .btn-plus-letra,
.combo-select-option .btn-plus-letra {
  font-size: 1.42em;
  line-height: 0;
  display: inline-block;
  vertical-align: -0.08em;
  margin-right: 0.05em;
  letter-spacing: 0;
}

button .btn-plus-letra {
  font-weight: 400;
}

.combo-select-option .btn-plus-letra {
  font-weight: 700;
}

.dashboard-quick-action .btn-plus-letra {
  vertical-align: -0.05em;
}

.toolbar-buttons .toolbar-icon-button {
  width: 36px;
  height: 36px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.toolbar-buttons .toolbar-icon-button svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.toolbar-buttons .toolbar-icon-button-square {
  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;
}

.toolbar-buttons .btn-servicios-excel {
  background: #16a34a;
  color: #ffffff;
}

.toolbar-buttons .btn-servicios-excel:hover {
  background: #15803d;
}

.toolbar-buttons .toolbar-filter-toggle {
  box-sizing: border-box;
  min-height: 36px;
  padding: 0 10px 0 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  background: #f3f4f6;
  color: #111827;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
}

.toolbar-buttons .toolbar-filter-toggle svg:not(.void-anular-icon) {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  fill: currentColor;
}

.toolbar-buttons .toolbar-filter-toggle svg.void-anular-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.toolbar-buttons .toolbar-filter-toggle:hover {
  background: #e5e7eb;
}

.toolbar-buttons .toolbar-filter-toggle.is-pressed {
  background: #eff6ff;
  border-color: #2563eb;
  color: #1d4ed8;
}

.toolbar-buttons .toolbar-filter-toggle.is-pressed:hover {
  background: #dbeafe;
}

/* [hidden] debe ganar sobre display:inline-flex del botón (evita que se vean con "(0)") */
.toolbar-buttons .toolbar-filter-toggle[hidden],
button.toolbar-filter-toggle[hidden] {
  display: none !important;
}

.toolbar-filter-count {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.toolbar-search {
  margin-bottom: 20px;
}

.toolbar-search .field.full input[type="text"] {
  padding: 11px 14px 11px 44px;
  border: 1px solid var(--app-card-list-border);
  border-radius: var(--control-radius);
  background-color: #ffffff;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
  font-size: 14px;
}

.toolbar-search .field.full input[type="text"]:focus {
  outline: none;
  border-color: rgba(37, 99, 235, 0.35);
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08), 0 0 0 3px rgba(37, 99, 235, 0.14);
}

.toolbar-search .field.full input[type="text"]::placeholder {
  color: #94a3b8;
}

.toolbar-search .field.full {
  position: relative;
}

.toolbar-search .field.full::before {
  content: '';
  position: absolute;
  left: 14px;
  top: 50%;
  width: 22px;
  height: 22px;
  transform: translateY(-50%);
  pointer-events: none;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px 20px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2394a3b8'%3E%3Cpath d='M3 5h18l-7 8v5l-4 2v-7L3 5z'/%3E%3C/svg%3E");
}

.list-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  align-items: end;
  margin-bottom: 20px;
}

.list-toolbar .toolbar-search {
  margin-bottom: 0;
  min-width: 0;
}

body:not(.is-mobile) #vistaClientes .list-toolbar .toolbar-search,
body:not(.is-mobile) #vistaPresupuestos .list-toolbar .toolbar-search,
body:not(.is-mobile) #vistaVentas .list-toolbar .toolbar-search,
body:not(.is-mobile) #vistaCitas .list-toolbar .toolbar-search,
body:not(.is-mobile) #vistaConsentimientosInformados .list-toolbar .toolbar-search,
body:not(.is-mobile) #vistaRecordatorios .list-toolbar .toolbar-search,
body:not(.is-mobile) #vistaServicios .list-toolbar .toolbar-search,
body:not(.is-mobile) #vistaFlujoCaja #panelFlujoCajaGastos .list-toolbar .toolbar-search {
  max-width: 300px;
}

body:not(.is-mobile) #vistaTransacciones .list-toolbar.transaction-tab-toolbar,
body:not(.is-mobile) #vistaVentas .list-toolbar.ventas-list-toolbar {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-end;
  gap: 12px 16px;
  overflow: visible;
}

body:not(.is-mobile) #vistaTransacciones .list-toolbar.transaction-tab-toolbar .toolbar-search,
body:not(.is-mobile) #vistaVentas .list-toolbar.ventas-list-toolbar .toolbar-search {
  flex: 1 1 300px;
  width: auto;
  max-width: 300px;
  min-width: 120px;
  margin-bottom: 0;
}

body:not(.is-mobile) #vistaTransacciones .list-toolbar.transaction-tab-toolbar .transacciones-periodo-field,
body:not(.is-mobile) #vistaVentas .list-toolbar.ventas-list-toolbar .ventas-periodo-field {
  flex: 1 1 240px;
  margin-bottom: 0;
  min-width: 50px;
  max-width: 240px;
  width: auto;
  overflow: visible;
}

body:not(.is-mobile) #vistaTransacciones .list-toolbar.transaction-tab-toolbar .transacciones-periodo-field .combo-select,
body:not(.is-mobile) #vistaVentas .list-toolbar.ventas-list-toolbar .ventas-periodo-field .combo-select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

body:not(.is-mobile) #vistaTransacciones .list-toolbar.transaction-tab-toolbar .transacciones-periodo-field .combo-select-input,
body:not(.is-mobile) #vistaVentas .list-toolbar.ventas-list-toolbar .ventas-periodo-field .combo-select-input {
  width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:not(.is-mobile) #vistaTransacciones .list-toolbar.transaction-tab-toolbar .toolbar-actions,
body:not(.is-mobile) #vistaVentas .list-toolbar.ventas-list-toolbar .toolbar-actions {
  flex: 0 0 auto;
  justify-content: flex-end;
  min-width: 0;
  margin-left: auto;
}

body:not(.is-mobile) #vistaTransacciones .list-toolbar.transaction-tab-toolbar .toolbar-actions.toolbar-buttons,
body:not(.is-mobile) #vistaVentas .list-toolbar.ventas-list-toolbar .toolbar-actions.toolbar-buttons {
  flex-wrap: nowrap;
}

.list-toolbar .toolbar-actions {
  min-width: 0;
}

.cita-form-layout {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.cita-form-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: end;
}

.cita-form-row.cita-form-row-full {
  grid-template-columns: minmax(0, 1fr);
}

.cita-form-row.cita-form-row-triple {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cita-form-layout .field {
  margin-bottom: 0;
}

.field:has(> input[type="date"][data-calendario-solo="true"]) > label {
  cursor: default;
}

input[type="date"][data-calendario-solo="true"] {
  background: #ffffff;
  color: #111827;
  cursor: pointer;
}

input[type="date"][data-calendario-solo="true"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: 1;
}

#citaDialog input[type="date"][data-calendario-solo="true"] {
  cursor: pointer;
  text-align: center;
  padding-left: 28px;
  padding-right: 28px;
}

#citaDialog .cita-form-layout .field > label,
#citaDialog .cita-recordatorio-paciente-item,
#citaDialog .cita-recordatorios-pacientes-label {
  font-size: 12px;
}

.cita-hora-fin-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
}

.cita-hora-fin-aviso-tooltip {
  position: relative;
  display: none;
  align-items: center;
  flex-shrink: 0;
  cursor: default;
  outline: none;
}

.cita-hora-fin-aviso-tooltip.is-visible {
  display: inline-flex;
}

.cita-hora-fin-aviso-icon {
  display: block;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 9px solid #dc2626;
}

.cita-hora-fin-aviso-content {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: calc(100% + 6px);
  z-index: 10050;
  display: none;
  min-width: 220px;
  max-width: min(320px, calc(100vw - 32px));
  padding: 8px 10px;
  border: 1px solid #fecaca;
  border-radius: 8px;
  background: #fff;
  color: #b91c1c;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.14);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  text-align: left;
  white-space: normal;
}

.cita-hora-fin-aviso-tooltip:hover .cita-hora-fin-aviso-content,
.cita-hora-fin-aviso-tooltip:focus .cita-hora-fin-aviso-content,
.cita-hora-fin-aviso-tooltip:focus-within .cita-hora-fin-aviso-content {
  display: block;
}

.time-picker-am-pm {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  height: 37px;
  min-height: 37px;
  max-height: 37px;
  box-sizing: border-box;
  border: 1px solid #ccc;
  border-radius: var(--control-radius);
  background: #fff;
  overflow: visible;
}

.time-picker-am-pm-inner {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 0px;
  min-width: 0;
  width: auto;
  max-width: 100%;
}

.time-picker-am-pm-sep {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  padding: 0;
  margin: 0;
  color: #111827;
  font-size: 14px;
  line-height: 1;
  user-select: none;
}

.time-picker-am-pm .combo-select-input,
.time-picker-am-pm .combo-select:not(.is-disabled) .combo-select-input:focus,
.time-picker-am-pm .combo-select.is-combo-no-filter .combo-select-input,
.time-picker-am-pm .combo-select.is-combo-no-filter:not(.is-disabled) .combo-select-input:focus {
  height: 100%;
  min-height: 0;
  width: auto;
  min-width: 0;
  max-width: none;
  border: none !important;
  outline: none;
  box-shadow: none;
  border-radius: 0;
  padding: 0 1px;
  background: transparent !important;
  font-size: 14px;
  text-align: center;
  field-sizing: content;
}

.time-picker-am-pm .combo-select-input::placeholder {
  color: transparent;
}

.time-picker-am-pm .combo-select {
  flex: 0 0 auto;
  width: auto;
  min-width: 0;
  height: 100%;
  border: none !important;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.time-picker-am-pm .combo-select:has([data-time-part="hour"]) {
  min-width: 1.6em;
  text-align: center;
}

.time-picker-am-pm .combo-select:has([data-time-part="minute"]) {
  min-width: 1.6em;
  text-align: center;
}

.time-picker-am-pm .combo-select:has([data-time-part="ampm"]) {
  min-width: 2.6em;
  text-align: center;
}

.time-picker-am-pm .combo-select-toggle {
  display: none;
}

.time-picker-am-pm .combo-select.is-disabled .combo-select-input,
.time-picker-am-pm.is-disabled .combo-select-input {
  background: transparent;
  color: #d3d3d3;
}

.time-picker-am-pm.has-error {
  border-color: #dc2626;
  box-shadow: 0 0 0 1px rgba(220, 38, 38, 0.15);
}

.time-picker-am-pm.is-disabled {
  background: #f3f4f6;
  cursor: not-allowed;
}

body.is-mobile #citaDialog .time-picker-am-pm .combo-select-input {
  padding-left: 1px;
  padding-right: 1px;
  font-size: 13px;
}

.cita-recordatorios-pacientes-block {
  align-items: stretch;
}

.cita-recordatorios-pacientes-label {
  display: block;
  font-weight: 600;
  margin-bottom: 10px;
  color: #1e293b;
  margin-top: 20px;
}

.cita-recordatorios-pacientes-hint {
  margin: 0 0 10px;
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.35;
}

.cita-recordatorios-pacientes-lista {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 220px;
  overflow-y: auto;
  padding: 10px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.cita-recordatorios-pacientes-vacio {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.4;
}

.cita-recordatorio-paciente-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.9375rem;
  line-height: 1.35;
  cursor: pointer;
}

.cita-recordatorio-paciente-item[aria-disabled="true"] {
  cursor: default;
  opacity: 0.72;
}

.cita-recordatorio-paciente-item input[type="checkbox"] {
  flex: 0 0 auto;
  flex-shrink: 0;
  width: auto;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 2px;
  border: none;
  border-radius: 4px;
  align-self: center;
}

.cita-recordatorio-paciente-linea {
  align-items: center;
  display: flex;
  flex: 1 1 0;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.cita-recordatorio-paciente-titulo {
  color: #000000;
}

.cita-recordatorio-paciente-hora {
  color: #000000;
  font-size: 12px;
  white-space: nowrap;
}

.cita-recordatorio-paciente-sep {
  color: #94a3b8;
  flex-shrink: 0;
}

.cita-recordatorio-paciente-estado {
  font-size: 9px;
  font-weight: 600;
  line-height: 1;
  padding: 4px 7px;
}

#citaDialog .cita-form-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
}

body.is-mobile .cita-form-row {
  grid-template-columns: minmax(0, 1fr);
}

body.is-mobile #citaDialog .cita-form-actions {
  flex-direction: row;
}

#citaDialog .clinical-evaluation-modal.cita-dialog-modal {
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-height: calc(100vh - 32px);
  max-width: 700px;
  overflow: hidden;
  width: min(700px, calc(100vw - 32px));
}

#citaDialog .cita-dialog-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

#citaDialog .cita-dialog-footer {
  flex-shrink: 0;
  margin: 0;
  padding: 12px 22px max(12px, env(safe-area-inset-bottom, 0px));
  border-top: 1px solid #e5e7eb;
  background: #ffffff;
  box-shadow: 0 -8px 18px rgba(15, 23, 42, 0.08);
}

body.is-mobile #citaDialog .clinical-evaluation-modal.cita-dialog-modal {
  max-height: 100dvh;
  height: 100dvh;
}

body.is-mobile #citaDialog .cita-dialog-modal-body {
  padding-bottom: 8px;
}

body.is-mobile #citaDialog .cita-dialog-footer {
  padding-left: 16px;
  padding-right: 16px;
}

#citaDetalleDialog .clinical-evaluation-modal.cita-detalle-modal {
  display: flex;
  flex-direction: column;
  min-height: 0;
  width: min(760px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  height: auto;
  overflow: hidden;
  max-width: 500px;
}

#citaDetalleDialog .cita-detalle-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

#citaDetalleDialog .clinical-evaluation-modal-footer.cita-dialog-footer {
  flex-shrink: 0;
  margin: 0;
  padding: 12px 22px max(12px, env(safe-area-inset-bottom, 0px));
  border-top: 1px solid #e5e7eb;
  background: #ffffff;
  box-shadow: 0 -8px 18px rgba(15, 23, 42, 0.08);
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

body.is-mobile #citaDetalleDialog .clinical-evaluation-modal.cita-detalle-modal {
  max-height: min(100dvh, calc(100vh - 16px));
}

body.is-mobile #citaDetalleDialog .cita-detalle-modal-body {
  padding-bottom: 8px;
}

body.is-mobile #citaDetalleDialog .clinical-evaluation-modal-footer.cita-dialog-footer {
  padding-left: 16px;
  padding-right: 16px;
}

.citas-periodo-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: flex-end;
  margin: -8px 0 20px;
}

.citas-periodo-toolbar .field {
  margin-bottom: 0;
}

.citas-periodo-toolbar .field.citas-periodo-field {
  flex: 0 1 minmax(160px, 240px);
  min-width: 160px;
}

.list-toolbar.transaction-tab-toolbar .field.transacciones-periodo-field,
.list-toolbar.ventas-list-toolbar .field.ventas-periodo-field {
  min-width: 50px;
  max-width: 240px;
  width: auto;
}

.citas-periodo-toolbar .field.citas-periodo-field .combo-select.has-prefix-icon .combo-select-input,
.list-toolbar.transaction-tab-toolbar .field.transacciones-periodo-field .combo-select.has-prefix-icon .combo-select-input,
.list-toolbar.ventas-list-toolbar .field.ventas-periodo-field .combo-select.has-prefix-icon .combo-select-input {
  padding-left: 36px;
}

.citas-periodo-toolbar .field.citas-periodo-field .combo-select-prefix-icon,
.list-toolbar.transaction-tab-toolbar .field.transacciones-periodo-field .combo-select-prefix-icon,
.list-toolbar.ventas-list-toolbar .field.ventas-periodo-field .combo-select-prefix-icon {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  color: #111827;
  pointer-events: none;
  line-height: 0;
}

.citas-periodo-toolbar .field.citas-periodo-field .combo-select-prefix-icon svg,
.list-toolbar.transaction-tab-toolbar .field.transacciones-periodo-field .combo-select-prefix-icon svg,
.list-toolbar.ventas-list-toolbar .field.ventas-periodo-field .combo-select-prefix-icon svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.list-toolbar.transaction-tab-toolbar .field.transacciones-periodo-field.is-filter-active .combo-select-prefix-icon,
.list-toolbar.ventas-list-toolbar .field.ventas-periodo-field.is-filter-active .combo-select-prefix-icon {
  color: #dc2626;
}

.citas-periodo-toolbar .field.citas-periodo-libre-field {
  flex: 0 1 minmax(148px, 180px);
  min-width: 148px;
}

.citas-periodo-libre-field label{

  font-size:12px;
}

.citas-periodo-calendario-wrap {
  margin-left: auto;
  flex: 0 0 auto;
  display: flex;
  align-items: flex-end;
}

#toolbarPeriodoCitas .btn-calendario-citas-toggle {
  box-sizing: border-box;
  width: 36px;
  height: 36px;
  min-width: 36px;
  min-height: 36px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1px solid transparent;
  border-radius: 6px;
  background: #2563eb;
  color: #ffffff;
  cursor: pointer;
  vertical-align: bottom;
}

#toolbarPeriodoCitas .btn-calendario-citas-toggle:hover {
  background: #1d4ed8;
}

#toolbarPeriodoCitas .btn-calendario-citas-toggle.is-cal-on {
  background: #eff6ff;
  border-color: #2563eb;
  color: #1d4ed8;
}

#toolbarPeriodoCitas .btn-calendario-citas-toggle.is-cal-on:hover {
  background: #dbeafe;
}

#toolbarPeriodoCitas .btn-calendario-citas-toggle .citas-cal-toggle-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

#toolbarPeriodoCitas .btn-calendario-citas-toggle svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

#toolbarPeriodoCitas .btn-calendario-citas-toggle.is-cal-on .citas-cal-icon-cal {
  display: none;
}

#toolbarPeriodoCitas .btn-calendario-citas-toggle.is-cal-on .citas-cal-icon-list {
  display: inline-flex !important;
}

#toolbarPeriodoCitas .btn-calendario-citas-toggle:not(.is-cal-on) .citas-cal-icon-list {
  display: none !important;
}

.citas-cal-wrap {
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}

.citas-cal-agenda-title {
  padding: 10px 14px;
  font-weight: 600;
  font-size: 14px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  color: #0f172a;
}

.citas-cal-agenda-scroll {
  overflow-x: auto;
  overflow-y: auto;
  max-height: min(78vh, 920px);
  -webkit-overflow-scrolling: touch;
}

.citas-cal-agenda-hours {
  position: relative;
}

.citas-cal-hour-label {
  position: absolute;
  left: 4px;
  transform: translateY(-50%);
  font-size: 11px;
  color: rgba(15, 23, 42, 0.55);
  white-space: nowrap;
}

.citas-cal-day-stack {
  position: relative;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0,
    transparent calc(var(--cal-hour-row, 48px) - 1px),
    rgba(15, 23, 42, 0.07) calc(var(--cal-hour-row, 48px) - 1px),
    rgba(15, 23, 42, 0.07) var(--cal-hour-row, 48px)
  );
  cursor: default;
}

.citas-cal-day-stack.citas-cal-day-stack-slots {
  cursor: default;
}

.citas-cal-slot-layer {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 1;
  pointer-events: none;
}

.citas-cal-slot-30 {
  position: absolute;
  left: 0;
  right: 0;
  box-sizing: border-box;
  z-index: 1;
  pointer-events: auto;
  cursor: pointer;
  border-radius: 2px;
}

.citas-cal-slot-30:hover {
  background-color: rgba(219, 234, 254, 0.42);
}

.citas-cal-slot-30.is-selected {
  outline: 2px solid #2563eb;
  outline-offset: -1px;
  background-color: rgba(191, 219, 254, 0.55);
}

.citas-cal-day-head .citas-cal-head-date {
  display: block;
  font-weight: 500;
  color: rgba(51, 65, 85, 0.75);
  font-size: 11px;
}

.citas-cal-event-abs {
  position: absolute;
  left: 3px;
  right: 3px;
  border-radius: 6px;
  padding: 4px 6px;
  font-size: 11px;
  line-height: 1.25;
  box-sizing: border-box;
  overflow: hidden;
  border: 1px solid rgba(37, 99, 235, 0.25);
  background: rgba(219, 234, 254, 0.95);
  color: #1e293b;
  cursor: pointer;
  z-index: 2;
}

.citas-cal-event-abs.citas-cal-cancel {
  cursor: default;
  background: rgba(255, 228, 232, 0.95);
  border-color: rgba(244, 63, 94, 0.25);
  color: rgba(107, 33, 45, 0.95);
}

.citas-cal-event-abs.citas-cal-confirm {
  background: rgba(220, 252, 231, 0.95);
  border-color: rgba(22, 163, 74, 0.28);
  color: #14532d;
}

.citas-cal-event-abs.citas-cal-atendida {
  background: rgba(219, 234, 254, 0.95);
  border-color: rgba(37, 99, 235, 0.28);
  color: #1e3a8a;
}

.citas-cal-event-all-day.citas-cal-cancel {
  cursor: default;
  background: rgba(255, 228, 232, 0.88);
  border-color: rgba(244, 63, 94, 0.2);
}

.citas-cal-event-all-day.citas-cal-confirm {
  background: rgba(220, 252, 231, 0.88);
  border-color: rgba(22, 163, 74, 0.22);
}

.citas-cal-event-all-day.citas-cal-atendida {
  background: rgba(219, 234, 254, 0.88);
  border-color: rgba(37, 99, 235, 0.22);
}

.citas-cal-event-tooltip-wrap {
  position: absolute;
  left: 3px;
  right: 3px;
  box-sizing: border-box;
  z-index: 2;
}

.citas-cal-event-tooltip-wrap .citas-cal-event-abs {
  position: relative;
  left: auto;
  right: auto;
  width: 100%;
  height: 100%;
}

.citas-cal-event-tooltip-content {
  display: none;
}

@media (hover: hover) and (pointer: fine) {
  .citas-cal-has-tooltip:hover .citas-cal-event-tooltip-content,
  .citas-cal-has-tooltip:focus-within .citas-cal-event-tooltip-content {
    display: block;
    position: absolute;
    left: 0;
    top: calc(100% + 6px);
    z-index: 30;
    min-width: 200px;
    max-width: min(320px, calc(100vw - 24px));
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    background: #ffffff;
    color: #111827;
    box-shadow: 0 14px 26px rgba(15, 23, 42, 0.16);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.45;
    white-space: pre-line;
    pointer-events: none;
  }
}

.citas-cal-event-all-day {
  position: relative;
  margin: 4px;
  padding: 6px 8px;
  border-radius: 6px;
  font-size: 12px;
  border: 1px dashed rgba(15, 23, 42, 0.15);
  background: rgba(241, 245, 249, 0.9);
}

.citas-cal-semana-mobile {
  padding: 0 0 8px;
}

.citas-cal-weekday-strip {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 10px 8px;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  background: #f8fafc;
}

.citas-cal-week-chip {
  flex: 0 0 auto;
  scroll-snap-align: start;
  min-width: 56px;
  padding: 8px 6px;
  border-radius: 10px;
  border: 1px solid transparent;
  background: #fff;
  cursor: pointer;
  text-align: center;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

.citas-cal-week-chip span {
  display: block;
  font-size: 11px;
  color: #64748b;
}

.citas-cal-week-chip strong {
  display: block;
  margin-top: 2px;
  font-size: 15px;
  color: #0f172a;
}

.citas-cal-week-chip:hover:not(.is-selected) {
  border-color: rgba(37, 99, 235, 0.28);
  background: rgba(248, 250, 252, 0.98);
}

.citas-cal-week-chip.is-selected {
  border-color: #2563eb;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.18);
}

.citas-cal-mes-grid-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.citas-cal-mes-weekdays {
  display: grid;
  grid-template-columns: repeat(7, minmax(36px, 1fr));
  gap: 0;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  color: #64748b;
  padding: 6px 4px 4px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  background: #f8fafc;
}

.citas-cal-mes-cells {
  display: grid;
  grid-template-columns: repeat(7, minmax(36px, 1fr));
  grid-auto-rows: minmax(72px, auto);
  gap: 0;
}

body.is-mobile .citas-cal-mes-cells {
  grid-auto-rows: minmax(52px, auto);
}

.citas-cal-mes-cell {
  border-right: 1px solid rgba(15, 23, 42, 0.06);
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
  padding: 4px 4px 6px;
  vertical-align: top;
  min-height: 52px;
  cursor: default;
}

.citas-cal-mes-cell:nth-child(7n) {
  border-right: none;
}

.citas-cal-mes-cell.is-out-month {
  background: rgba(248, 250, 252, 0.7);
  color: #94a3b8;
}

.citas-cal-mes-cell.is-selected {
  outline: 2px solid #2563eb;
  outline-offset: -2px;
  z-index: 1;
}

.citas-cal-mes-cell:not(.is-out-month):hover {
  background-color: rgba(219, 234, 254, 0.38);
}

.citas-cal-mes-daynum {
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 2px;
}

.citas-cal-mes-pill {
  font-size: 10px;
  line-height: 1.2;
  padding: 2px 4px;
  margin-top: 2px;
  border-radius: 4px;
  background: rgba(219, 234, 254, 0.88);
  border: 1px solid rgba(37, 99, 235, 0.2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}

.citas-cal-mes-pill.citas-cal-cancel {
  background: rgba(255, 228, 232, 0.88);
  border-color: rgba(244, 63, 94, 0.2);
  cursor: default;
}

.citas-cal-mes-pill.citas-cal-confirm {
  background: rgba(220, 252, 231, 0.88);
  border-color: rgba(22, 163, 74, 0.22);
}

.citas-cal-mes-pill.citas-cal-atendida {
  background: rgba(219, 234, 254, 0.88);
  border-color: rgba(37, 99, 235, 0.22);
}

.citas-cal-mes-more {
  font-size: 10px;
  color: #64748b;
  margin-top: 2px;
}

.citas-cal-mes-mobile-list {
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  padding: 12px 10px 16px;
  background: #fff;
}

.citas-cal-mes-mobile-list h4 {
  margin: 0 0 10px;
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
}

.citas-cal-list-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 10px;
  border-radius: 10px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  margin-bottom: 8px;
  background: #fafbfc;
  cursor: pointer;
  min-height: 44px;
  box-sizing: border-box;
}

.citas-cal-list-row.citas-cal-cancel {
  cursor: default;
  background: #fff1f2;
}

.citas-cal-list-row.citas-cal-confirm {
  background: #ecfdf5;
}

.citas-cal-list-row.citas-cal-atendida {
  background: #eff6ff;
}

.citas-cal-list-row.citas-cal-confirm .citas-cal-list-time {
  color: #166534;
}

.citas-cal-list-row.citas-cal-atendida .citas-cal-list-time {
  color: #1d4ed8;
}

.citas-cal-list-time {
  flex: 0 0 84px;
  font-size: 12px;
  font-weight: 600;
  color: #2563eb;
}

.citas-cal-list-row.citas-cal-cancel .citas-cal-list-time {
  color: #9f1239;
}

.citas-cal-list-body {
  flex: 1;
  min-width: 0;
}

.citas-cal-list-title {
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
}

.citas-cal-list-meta {
  font-size: 12px;
  color: #64748b;
  margin-top: 2px;
}

.citas-cal-flex-main {
  display: flex;
  align-items: flex-start;
  min-width: min-content;
}

.citas-cal-flex-gutter {
  flex: 0 0 52px;
  align-self: stretch;
  position: sticky;
  left: 0;
  z-index: 4;
  background: #fafbfc;
  border-right: 1px solid rgba(15, 23, 42, 0.08);
}

.citas-cal-flex-gutter .citas-cal-time-corner {
  box-sizing: border-box;
  padding: 6px 4px;
  min-height: 52px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.citas-cal-allday-spacer {
  box-sizing: border-box;
  flex: 0 0 auto;
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
  background: #fff;
}

.citas-cal-flex-days {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: 0;
}

.citas-cal-flex-days.citas-cal-cols-7 .citas-cal-day-headers-row,
.citas-cal-flex-days.citas-cal-cols-7 .citas-cal-day-body-row {
  display: grid;
  grid-template-columns: repeat(7, minmax(92px, 1fr));
}

.citas-cal-flex-days:not(.citas-cal-cols-7) .citas-cal-day-headers-row,
.citas-cal-flex-days:not(.citas-cal-cols-7) .citas-cal-day-body-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.citas-cal-day-headers-row {
  position: sticky;
  top: 0;
  z-index: 3;
}

.citas-cal-day-body-row {
  align-items: stretch;
}

.citas-cal-day-head {
  text-align: center;
  padding: 6px 4px;
  font-size: 12px;
  font-weight: 600;
  color: #334155;
  background: #f8fafc;
  border-right: 1px solid rgba(15, 23, 42, 0.06);
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  box-sizing: border-box;
  min-height: 52px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.citas-cal-day-head:last-child {
  border-right: none;
}

.citas-cal-day-column {
  border-right: 1px solid rgba(15, 23, 42, 0.06);
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1 1 0;
  background: #fff;
}

.citas-cal-day-column:last-child {
  border-right: none;
}

.citas-cal-allday-area {
  padding: 4px 6px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
  background: #fff;
}

.citas-cal-time-rail {
  background: #fafbfc;
}

.citas-periodo-toolbar:not(.is-libre) .citas-periodo-libre-field {
  display: none;
}

body.is-mobile #vistaCitas .list-toolbar.citas-toolbar {
  flex-direction: column;
  align-items: stretch;
}

body.is-mobile #vistaCitas .citas-periodo-toolbar {
  flex-direction: column;
  align-items: stretch;
  margin: 0 0 16px;
}

body.is-mobile #vistaCitas .citas-periodo-calendario-wrap {
  margin-left: 0;
  width: 100%;
  justify-content: flex-end;
}

body.is-mobile #vistaCitas .btn-calendario-citas-toggle {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
}
body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes .list-toolbar,
body.is-mobile[data-mobile-list-footer="servicios"] #vistaServicios .list-toolbar,
body.is-mobile[data-mobile-list-footer="recordatorios"] #vistaRecordatorios .list-toolbar,
body.is-mobile[data-mobile-list-footer="citas"] #vistaCitas .list-toolbar,
body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar.ventas-list-toolbar,
body.is-mobile[data-mobile-list-footer="presupuestos"] #vistaPresupuestos .list-toolbar,
body.is-mobile[data-mobile-list-footer="consentimientos"] #vistaConsentimientosInformados .list-toolbar,
body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar.transaction-tab-toolbar,
body.is-mobile[data-mobile-list-footer="flujo-caja-gastos"] #vistaFlujoCaja #panelFlujoCajaGastos .list-toolbar.flujo-caja-gastos-toolbar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: calc(env(safe-area-inset-bottom, 0px) + var(--vv-keyboard-inset, 0px));
  z-index: 1240;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 10px 16px;
  box-sizing: border-box;
  background: #ffffff;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 -4px 16px rgba(15, 23, 42, 0.06);
}

body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes .list-toolbar .toolbar-actions.toolbar-buttons,
body.is-mobile[data-mobile-list-footer="servicios"] #vistaServicios .list-toolbar .toolbar-actions.toolbar-buttons,
body.is-mobile[data-mobile-list-footer="recordatorios"] #vistaRecordatorios .list-toolbar .toolbar-actions.toolbar-buttons,
body.is-mobile[data-mobile-list-footer="citas"] #vistaCitas .list-toolbar .toolbar-actions.toolbar-buttons,
body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar .toolbar-actions.toolbar-buttons,
body.is-mobile[data-mobile-list-footer="presupuestos"] #vistaPresupuestos .list-toolbar .toolbar-actions.toolbar-buttons,
body.is-mobile[data-mobile-list-footer="consentimientos"] #vistaConsentimientosInformados .list-toolbar .toolbar-actions.toolbar-buttons,
body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .toolbar-actions.toolbar-buttons,
body.is-mobile[data-mobile-list-footer="flujo-caja-gastos"] #vistaFlujoCaja #panelFlujoCajaGastos .list-toolbar .toolbar-actions.toolbar-buttons {
  display: contents;
}

body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes .list-toolbar .toolbar-search,
body.is-mobile[data-mobile-list-footer="servicios"] #vistaServicios .list-toolbar .toolbar-search,
body.is-mobile[data-mobile-list-footer="recordatorios"] #vistaRecordatorios .list-toolbar .toolbar-search,
body.is-mobile[data-mobile-list-footer="citas"] #vistaCitas .list-toolbar .toolbar-search,
body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar .toolbar-search,
body.is-mobile[data-mobile-list-footer="presupuestos"] #vistaPresupuestos .list-toolbar .toolbar-search,
body.is-mobile[data-mobile-list-footer="consentimientos"] #vistaConsentimientosInformados .list-toolbar .toolbar-search,
body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .toolbar-search,
body.is-mobile[data-mobile-list-footer="flujo-caja-gastos"] #vistaFlujoCaja #panelFlujoCajaGastos .list-toolbar .toolbar-search {
  order: 2;
  flex: 1 1 auto;
  min-width: 0;
  margin-bottom: 0;
}

body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .toolbar-search {
  order: 2;
  flex: 2 1 0;
  min-width: 0;
  max-width: none;
  margin-bottom: 0;
}

body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar.ventas-list-toolbar .toolbar-search {
  order: 2;
  flex: 2 1 0;
  min-width: 0;
  max-width: none;
  margin-bottom: 0;
}

body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .transacciones-periodo-field {
  order: 3;
  flex: 0 0 36px;
  width: 36px;
  min-width: 36px;
  max-width: 36px;
  overflow: visible;
}

body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar.ventas-list-toolbar .ventas-periodo-field {
  order: 3;
  flex: 0 0 36px;
  width: 36px;
  min-width: 36px;
  max-width: 36px;
  overflow: visible;
}

body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .transacciones-periodo-field .combo-select.has-prefix-icon {
  box-sizing: border-box;
  width: 36px;
  height: 36px;
  min-width: 36px;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  background: #f3f4f6;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar.ventas-list-toolbar .ventas-periodo-field .combo-select.has-prefix-icon {
  box-sizing: border-box;
  width: 36px;
  height: 36px;
  min-width: 36px;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  background: #f3f4f6;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .transacciones-periodo-field .combo-select-input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-width: 0;
  opacity: 0;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
}

body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar.ventas-list-toolbar .ventas-periodo-field .combo-select-input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-width: 0;
  opacity: 0;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
}

body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .transacciones-periodo-field .combo-select-toggle {
  display: none;
}

body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar.ventas-list-toolbar .ventas-periodo-field .combo-select-toggle {
  display: none;
}

body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .transacciones-periodo-field .combo-select-prefix-icon {
  position: static;
  left: auto;
  top: auto;
  transform: none;
  width: 18px;
  height: 18px;
  color: #111827;
  pointer-events: none;
}

body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar.ventas-list-toolbar .ventas-periodo-field .combo-select-prefix-icon {
  position: static;
  left: auto;
  top: auto;
  transform: none;
  width: 18px;
  height: 18px;
  color: #111827;
  pointer-events: none;
}

body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .transacciones-periodo-field.is-filter-active .combo-select-prefix-icon {
  color: #dc2626;
}

body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar.ventas-list-toolbar .ventas-periodo-field.is-filter-active .combo-select-prefix-icon {
  color: #dc2626;
}

body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .transacciones-periodo-field .combo-select-prefix-icon svg {
  width: 18px;
  height: 18px;
}

body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar.ventas-list-toolbar .ventas-periodo-field .combo-select-prefix-icon svg {
  width: 18px;
  height: 18px;
}

body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes .list-toolbar .list-toolbar-more-menu,
body.is-mobile[data-mobile-list-footer="presupuestos"] #vistaPresupuestos .list-toolbar .list-toolbar-more-menu,
body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar .list-toolbar-more-menu,
body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .list-toolbar-more-menu,
body.is-mobile[data-mobile-list-footer="servicios"] #vistaServicios .list-toolbar .btn-cambiar-vista,
body.is-mobile[data-mobile-list-footer="recordatorios"] #vistaRecordatorios .list-toolbar .btn-cambiar-vista,
body.is-mobile[data-mobile-list-footer="citas"] #vistaCitas .list-toolbar .btn-cambiar-vista,
body.is-mobile[data-mobile-list-footer="consentimientos"] #vistaConsentimientosInformados .list-toolbar .btn-cambiar-vista,
body.is-mobile[data-mobile-list-footer="flujo-caja-gastos"] #vistaFlujoCaja #panelFlujoCajaGastos .list-toolbar .btn-cambiar-vista {
  order: 1;
  flex-shrink: 0;
}

body.is-mobile[data-mobile-list-footer] .list-toolbar [class$="-columnas-trigger"] {
  display: none !important;
}

body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes .list-toolbar .toolbar-filter-toggle:not(.toolbar-more-trigger),
body.is-mobile[data-mobile-list-footer="servicios"] #vistaServicios .list-toolbar .toolbar-filter-toggle,
body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar .toolbar-filter-toggle,
body.is-mobile[data-mobile-list-footer="presupuestos"] #vistaPresupuestos .list-toolbar .toolbar-filter-toggle,
body.is-mobile[data-mobile-list-footer="consentimientos"] #vistaConsentimientosInformados .list-toolbar .toolbar-filter-toggle,
body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .toolbar-filter-toggle {
  order: 4;
}

body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes .list-toolbar .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="servicios"] #vistaServicios .list-toolbar .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="recordatorios"] #vistaRecordatorios .list-toolbar .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="citas"] #vistaCitas .list-toolbar .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="presupuestos"] #vistaPresupuestos .list-toolbar .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="consentimientos"] #vistaConsentimientosInformados .list-toolbar .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="flujo-caja-gastos"] #vistaFlujoCaja #panelFlujoCajaGastos .list-toolbar .btn-nuevo-listado-mobile-footer {
  order: 4;
  flex-shrink: 0;
}

body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar.ventas-list-toolbar .btn-nuevo-listado-mobile-footer {
  order: 5;
  flex-shrink: 0;
}

body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .btn-nuevo-listado-mobile-footer {
  order: 5;
  flex-shrink: 0;
}

body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes .list-toolbar button,
body.is-mobile[data-mobile-list-footer="servicios"] #vistaServicios .list-toolbar button,
body.is-mobile[data-mobile-list-footer="recordatorios"] #vistaRecordatorios .list-toolbar button,
body.is-mobile[data-mobile-list-footer="citas"] #vistaCitas .list-toolbar button,
body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar button,
body.is-mobile[data-mobile-list-footer="presupuestos"] #vistaPresupuestos .list-toolbar button,
body.is-mobile[data-mobile-list-footer="consentimientos"] #vistaConsentimientosInformados .list-toolbar button,
body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar button,
body.is-mobile[data-mobile-list-footer="flujo-caja-gastos"] #vistaFlujoCaja #panelFlujoCajaGastos .list-toolbar button {
  width: auto;
}

body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="servicios"] #vistaServicios .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="recordatorios"] #vistaRecordatorios .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="citas"] #vistaCitas .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="presupuestos"] #vistaPresupuestos .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="consentimientos"] #vistaConsentimientosInformados .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="flujo-caja-gastos"] #vistaFlujoCaja #panelFlujoCajaGastos .btn-nuevo-listado-mobile-footer {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 40px;
  height: 40px;
  min-width: 40px;
  padding: 0;
  border-radius: 999px;
  background: #2563eb;
  color: #ffffff;
  border: none;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.1);
}

body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes .btn-nuevo-listado-mobile-footer .btn-plus-letra,
body.is-mobile[data-mobile-list-footer="servicios"] #vistaServicios .btn-nuevo-listado-mobile-footer .btn-plus-letra,
body.is-mobile[data-mobile-list-footer="recordatorios"] #vistaRecordatorios .btn-nuevo-listado-mobile-footer .btn-plus-letra,
body.is-mobile[data-mobile-list-footer="citas"] #vistaCitas .btn-nuevo-listado-mobile-footer .btn-plus-letra,
body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .btn-nuevo-listado-mobile-footer .btn-plus-letra,
body.is-mobile[data-mobile-list-footer="presupuestos"] #vistaPresupuestos .btn-nuevo-listado-mobile-footer .btn-plus-letra,
body.is-mobile[data-mobile-list-footer="consentimientos"] #vistaConsentimientosInformados .btn-nuevo-listado-mobile-footer .btn-plus-letra,
body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .btn-nuevo-listado-mobile-footer .btn-plus-letra,
body.is-mobile[data-mobile-list-footer="flujo-caja-gastos"] #vistaFlujoCaja #panelFlujoCajaGastos .btn-nuevo-listado-mobile-footer .btn-plus-letra {
  margin: 0;
  font-size: 30px;
  font-weight: 500;
  line-height: 1;
}

body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes .btn-nuevo-listado-mobile-footer .btn-nuevo-listado-text,
body.is-mobile[data-mobile-list-footer="servicios"] #vistaServicios .btn-nuevo-listado-mobile-footer .btn-nuevo-listado-text,
body.is-mobile[data-mobile-list-footer="recordatorios"] #vistaRecordatorios .btn-nuevo-listado-mobile-footer .btn-nuevo-listado-text,
body.is-mobile[data-mobile-list-footer="citas"] #vistaCitas .btn-nuevo-listado-mobile-footer .btn-nuevo-listado-text,
body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .btn-nuevo-listado-mobile-footer .btn-nuevo-listado-text,
body.is-mobile[data-mobile-list-footer="presupuestos"] #vistaPresupuestos .btn-nuevo-listado-mobile-footer .btn-nuevo-listado-text,
body.is-mobile[data-mobile-list-footer="consentimientos"] #vistaConsentimientosInformados .btn-nuevo-listado-mobile-footer .btn-nuevo-listado-text,
body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .btn-nuevo-listado-mobile-footer .btn-nuevo-listado-text,
body.is-mobile[data-mobile-list-footer="flujo-caja-gastos"] #vistaFlujoCaja #panelFlujoCajaGastos .btn-nuevo-listado-mobile-footer .btn-nuevo-listado-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

#gastoFlujoCajaDialog .clinical-evaluation-modal.gasto-flujo-caja-dialog-modal {
  display: flex;
  flex-direction: column;
  width: min(700px, calc(100vw - 32px));
  min-height: 0;
  max-height: calc(100vh - 32px);
  overflow: hidden;
}

#gastoFlujoCajaDialog .gasto-flujo-caja-dialog-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

#gastoFlujoCajaDialogMensaje.dialog-inline-message {
  margin: 0 0 12px;
  display: none;
}

#gastoFlujoCajaDialogMensaje.dialog-inline-message.visible {
  display: block;
}

#gastoFlujoCajaDialogMensaje.dialog-inline-message.success,
#gastoFlujoCajaDialogMensaje.dialog-inline-message.error {
  border-radius: 6px;
}

#gastoFlujoCajaDialogMensaje .message-close {
  cursor: pointer;
}

#gastoFlujoCajaDialog .gasto-flujo-caja-dialog-footer {
  flex-shrink: 0;
  margin: 0;
  padding: 12px 22px max(12px, env(safe-area-inset-bottom, 0px));
  border-top: 1px solid #e5e7eb;
  background: #ffffff;
  box-shadow: 0 -8px 18px rgba(15, 23, 42, 0.08);
}

body.is-mobile #gastoFlujoCajaDialog .clinical-evaluation-modal.gasto-flujo-caja-dialog-modal {
  max-height: min(100dvh, calc(100vh - 16px));
}

body.is-mobile #gastoFlujoCajaDialog .gasto-flujo-caja-dialog-body {
  padding-bottom: 8px;
}

body.is-mobile #gastoFlujoCajaDialog .gasto-flujo-caja-dialog-footer {
  padding-left: 16px;
  padding-right: 16px;
}

/* Texto "Meses" sin <label for=…>: evita que el clic active el combo (solo el recuadro del trigger). */
#gastoFlujoCajaDialog .gasto-flujo-caja-meses-field-caption {
  display: block;
  margin-bottom: 6px;
  font-size: 12px;
  font-weight: bold;
}

#gastoFlujoCajaDialog .gasto-flujo-caja-meses-combo .config-multi-combo-dropdown {
  z-index: 20050;
}

.gasto-flujo-caja-row-periodo {
  display: grid;
  gap: 12px;
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}

@media (min-width: 768px) {
  .gasto-flujo-caja-row-periodo {
    grid-template-columns: minmax(88px, 120px) minmax(0, 1fr) minmax(88px, 120px);
  }
}

.gasto-flujo-caja-anio-field,
.gasto-flujo-caja-meses-field,
.gasto-flujo-caja-dia-field {
  min-width: 0;
}

/* Ocupa todo el ancho del .grid padre (2 columnas); si no, la fila queda en media columna. */
.gasto-flujo-caja-row-datos {
  display: grid;
  gap: 12px;
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}

@media (min-width: 1024px) {
  .gasto-flujo-caja-row-datos {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 120px;
  }

  .gasto-flujo-caja-proveedor-field,
  .gasto-flujo-caja-concepto-field {
    min-width: 0;
  }

  .gasto-flujo-caja-proveedor-field input[type="text"],
  .gasto-flujo-caja-concepto-field input[type="text"] {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .gasto-flujo-caja-monto-field {
    width: 120px;
    min-width: 120px;
    max-width: 120px;
    box-sizing: border-box;
  }

  .gasto-flujo-caja-monto-field .amount-input {
    width: 100%;
    box-sizing: border-box;
  }
}

body.is-mobile #vistaServicios #btnFiltroServiciosInactivos {
  display: none !important;
}

body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes #resultadoBusqueda,
body.is-mobile[data-mobile-list-footer="servicios"] #vistaServicios #resultadoServicios,
body.is-mobile[data-mobile-list-footer="recordatorios"] #vistaRecordatorios #resultadoRecordatorios,
body.is-mobile[data-mobile-list-footer="citas"] #vistaCitas #resultadoCitas,
body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas #resultadoVentas,
body.is-mobile[data-mobile-list-footer="presupuestos"] #vistaPresupuestos #resultadoPresupuestos,
body.is-mobile[data-mobile-list-footer="consentimientos"] #vistaConsentimientosInformados #resultadoConsentimientos,
body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones #resultadoTransacciones,
body.is-mobile[data-mobile-list-footer="flujo-caja-gastos"] #vistaFlujoCaja #resultadoGastosFlujoCaja,
body.is-mobile[data-mobile-list-footer="cliente-historial-ventas"] #resultadoHistorialVentasCliente,
body.is-mobile[data-mobile-list-footer="cliente-historial-presupuestos"] #resultadoHistorialPresupuestosCliente,
body.is-mobile[data-mobile-list-footer="cliente-historial-pagos"] #resultadoHistorialPagosCliente,
body.is-mobile[data-mobile-list-footer="cliente-historial-citas"] #resultadoHistorialCitasCliente {
  padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px) + var(--vv-keyboard-inset, 0px));
}

body.is-mobile[data-mobile-list-footer="cliente-historial-ventas"] #panelHistorialVentasCliente .list-toolbar,
body.is-mobile[data-mobile-list-footer="cliente-historial-presupuestos"] #panelHistorialPresupuestosCliente .list-toolbar,
body.is-mobile[data-mobile-list-footer="cliente-historial-pagos"] #panelHistorialPagosCliente .list-toolbar,
body.is-mobile[data-mobile-list-footer="cliente-historial-citas"] #panelHistorialCitasCliente .list-toolbar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: calc(env(safe-area-inset-bottom, 0px) + var(--vv-keyboard-inset, 0px));
  z-index: 1240;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 10px 16px;
  box-sizing: border-box;
  background: #ffffff;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 -4px 16px rgba(15, 23, 42, 0.06);
}

body.is-mobile[data-mobile-list-footer="cliente-historial-ventas"] #panelHistorialVentasCliente .list-toolbar .toolbar-actions.toolbar-buttons,
body.is-mobile[data-mobile-list-footer="cliente-historial-presupuestos"] #panelHistorialPresupuestosCliente .list-toolbar .toolbar-actions.toolbar-buttons,
body.is-mobile[data-mobile-list-footer="cliente-historial-pagos"] #panelHistorialPagosCliente .list-toolbar .toolbar-actions.toolbar-buttons,
body.is-mobile[data-mobile-list-footer="cliente-historial-citas"] #panelHistorialCitasCliente .list-toolbar .toolbar-actions.toolbar-buttons {
  display: contents;
}

body.is-mobile[data-mobile-list-footer="cliente-historial-ventas"] #panelHistorialVentasCliente .list-toolbar .toolbar-search,
body.is-mobile[data-mobile-list-footer="cliente-historial-presupuestos"] #panelHistorialPresupuestosCliente .list-toolbar .toolbar-search,
body.is-mobile[data-mobile-list-footer="cliente-historial-pagos"] #panelHistorialPagosCliente .list-toolbar .toolbar-search,
body.is-mobile[data-mobile-list-footer="cliente-historial-citas"] #panelHistorialCitasCliente .list-toolbar .toolbar-search {
  order: 2;
  flex: 1 1 auto;
  min-width: 0;
  margin-bottom: 0;
}

body.is-mobile[data-mobile-list-footer="cliente-historial-ventas"] #panelHistorialVentasCliente .list-toolbar .toolbar-more-trigger,
body.is-mobile[data-mobile-list-footer="cliente-historial-ventas"] #panelHistorialVentasCliente .list-toolbar .list-toolbar-more-menu,
body.is-mobile[data-mobile-list-footer="cliente-historial-presupuestos"] #panelHistorialPresupuestosCliente .list-toolbar .toolbar-more-trigger,
body.is-mobile[data-mobile-list-footer="cliente-historial-presupuestos"] #panelHistorialPresupuestosCliente .list-toolbar .list-toolbar-more-menu,
body.is-mobile[data-mobile-list-footer="cliente-historial-pagos"] #panelHistorialPagosCliente .list-toolbar .toolbar-more-trigger,
body.is-mobile[data-mobile-list-footer="cliente-historial-pagos"] #panelHistorialPagosCliente .list-toolbar .list-toolbar-more-menu {
  order: 1;
  flex-shrink: 0;
}

body.is-mobile[data-mobile-list-footer="cliente-historial-ventas"] #panelHistorialVentasCliente .list-toolbar .btn-cambiar-vista,
body.is-mobile[data-mobile-list-footer="cliente-historial-presupuestos"] #panelHistorialPresupuestosCliente .list-toolbar .btn-cambiar-vista,
body.is-mobile[data-mobile-list-footer="cliente-historial-pagos"] #panelHistorialPagosCliente .list-toolbar .btn-cambiar-vista,
body.is-mobile[data-mobile-list-footer="cliente-historial-citas"] #panelHistorialCitasCliente .list-toolbar .btn-cambiar-vista {
  order: 1;
  flex-shrink: 0;
}

body.is-mobile[data-mobile-list-footer="cliente-historial-ventas"] #panelHistorialVentasCliente .list-toolbar .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="cliente-historial-presupuestos"] #panelHistorialPresupuestosCliente .list-toolbar .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="cliente-historial-pagos"] #panelHistorialPagosCliente .list-toolbar .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="cliente-historial-citas"] #panelHistorialCitasCliente .list-toolbar .btn-nuevo-listado-mobile-footer {
  order: 4;
  flex-shrink: 0;
}

body.is-mobile[data-mobile-list-footer="cliente-historial-ventas"] #panelHistorialVentasCliente .list-toolbar button,
body.is-mobile[data-mobile-list-footer="cliente-historial-presupuestos"] #panelHistorialPresupuestosCliente .list-toolbar button,
body.is-mobile[data-mobile-list-footer="cliente-historial-pagos"] #panelHistorialPagosCliente .list-toolbar button,
body.is-mobile[data-mobile-list-footer="cliente-historial-citas"] #panelHistorialCitasCliente .list-toolbar button {
  width: auto;
}

body.is-mobile[data-mobile-list-footer="cliente-historial-ventas"] #panelHistorialVentasCliente .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="cliente-historial-presupuestos"] #panelHistorialPresupuestosCliente .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="cliente-historial-pagos"] #panelHistorialPagosCliente .btn-nuevo-listado-mobile-footer,
body.is-mobile[data-mobile-list-footer="cliente-historial-citas"] #panelHistorialCitasCliente .btn-nuevo-listado-mobile-footer {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 40px;
  height: 40px;
  min-width: 40px;
  padding: 0;
  border-radius: 999px;
  background: #2563eb;
  color: #ffffff;
  border: none;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.1);
}

body.is-mobile[data-mobile-list-footer="cliente-historial-ventas"] #panelHistorialVentasCliente .btn-nuevo-listado-mobile-footer .btn-plus-letra,
body.is-mobile[data-mobile-list-footer="cliente-historial-presupuestos"] #panelHistorialPresupuestosCliente .btn-nuevo-listado-mobile-footer .btn-plus-letra,
body.is-mobile[data-mobile-list-footer="cliente-historial-pagos"] #panelHistorialPagosCliente .btn-nuevo-listado-mobile-footer .btn-plus-letra,
body.is-mobile[data-mobile-list-footer="cliente-historial-citas"] #panelHistorialCitasCliente .btn-nuevo-listado-mobile-footer .btn-plus-letra {
  margin: 0;
  font-size: 30px;
  font-weight: 500;
  line-height: 1;
}

body.is-mobile[data-mobile-list-footer="cliente-historial-ventas"] #panelHistorialVentasCliente .btn-nuevo-listado-mobile-footer .btn-nuevo-listado-text,
body.is-mobile[data-mobile-list-footer="cliente-historial-presupuestos"] #panelHistorialPresupuestosCliente .btn-nuevo-listado-mobile-footer .btn-nuevo-listado-text,
body.is-mobile[data-mobile-list-footer="cliente-historial-pagos"] #panelHistorialPagosCliente .btn-nuevo-listado-mobile-footer .btn-nuevo-listado-text,
body.is-mobile[data-mobile-list-footer="cliente-historial-citas"] #panelHistorialCitasCliente .btn-nuevo-listado-mobile-footer .btn-nuevo-listado-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.table-responsive {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  border-radius: 12px;
  background: white;
  border: 1px solid var(--app-card-list-border);
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05);
}

#resultadoRecordatorios > .table-responsive.table-desktop {
  overflow: visible;
}

.table-desktop {
  display: block;
}

body.use-card-view .table-desktop {
  display: none;
}

body.use-card-view .clientes-cards {
  display: grid;
}

body.use-table-view .table-desktop {
  display: block;
}

body.use-table-view .clientes-cards {
  display: none;
}

.clientes-cards {
  display: none;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.cliente-card {
  background: #ffffff;
  border: none;
  border-radius: 14px;
  padding: 16px;
  position: relative;
  box-shadow: 1px 1px 5px rgba(15, 23, 42, 0.3);
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.cliente-card-header {
  margin-bottom: 12px;
  padding-right: 42px;
}

.cliente-card-nombre {
  font-size: 16px;
  font-weight: bold;
  color: #111827;
}

.cliente-card-campo {
  margin-top: 2px;
  font-size: 14px;
  color: #111827;
}

.cliente-card-etiqueta {
  font-weight: bold;
  color: #111827;
}

.cliente-card-campo-etiquetas {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
}

.cliente-card-campo-etiquetas .cliente-card-etiqueta {
  flex: 0 0 auto;
  font-size: 12px;
}

.cliente-card-campo-etiquetas .client-tags-chips {
  flex: 1 1 auto;
  margin-top: 0;
  min-width: 0;
}

.cliente-card-actions {
  display: none;
}

.cliente-card-menu-anchor {
  position: absolute;
  top: 12px;
  right: 12px;
}

.card-menu-toggle {
  width: 34px;
  height: 34px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 999px;
  background: transparent;
  color: #111827;
  cursor: pointer;
}

.card-menu-toggle:hover {
  background: transparent;
}

.card-menu-toggle svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.card-actions-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 170px;
  display: none;
  flex-direction: column;
  padding: 8px;
  border-radius: 10px;
  border: 1px solid #d1d5db;
  background: #ffffff;
  box-shadow: 0 14px 26px rgba(15, 23, 42, 0.14);
  z-index: 5;
}

.card-actions-menu.visible {
  display: flex;
}

.card-action-button {
  border: none;
  background: transparent;
  color: #111827;
  padding: 10px 12px;
  text-align: left;
  border-radius: 8px;
  cursor: pointer;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 9px;
}

.card-action-icon {
  width: 16px;
  height: 16px;
  min-width: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: currentColor;
}

.card-action-icon svg:not(.void-anular-icon) {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

.card-action-icon svg[fill='none']:not(.void-anular-icon) {
  fill: none;
}

.card-action-icon svg[fill='none']:not(.void-anular-icon) circle,
.card-action-icon svg[fill='none']:not(.void-anular-icon) path,
.card-action-icon svg[fill='none']:not(.void-anular-icon) line,
.card-action-icon svg[fill='none']:not(.void-anular-icon) polyline {
  fill: none;
  stroke: currentColor;
}

.card-action-icon svg.void-anular-icon {
  width: 16px;
  height: 16px;
}

.card-action-button:hover {
  background: #eff6ff;
}

.card-action-button.danger {
  color: #b91c1c;
}

.card-action-button.danger:hover {
  background: #fee2e2;
}

.card-action-button.success {
  color: #15803d;
}

.card-action-button.success:hover {
  background: #c4f7d6;
}

.card-action-button.warning {
  color: #92400e;
}

.card-action-button.warning:hover {
  background: #fef3c7;
}

.empty-state {
  padding: 20px;
  background: #ffffff;
  border: 1px solid var(--app-card-list-border);
  border-radius: 14px;
  color: #111827;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05);
  font-size:14px;
}

.visita-home-loading {
  display: inline-flex;
  align-items: baseline;
  gap: 2px;
  font-weight: 600;
}

.visita-home-loading-dot {
  animation: visita-home-loading-dot 1.2s infinite ease-in-out;
  opacity: 0.25;
}

.visita-home-loading-dot:nth-child(2) {
  animation-delay: 0.15s;
}

.visita-home-loading-dot:nth-child(3) {
  animation-delay: 0.3s;
}

@keyframes visita-home-loading-dot {
  0%, 80%, 100% {
    opacity: 0.25;
    transform: translateY(0);
  }

  40% {
    opacity: 1;
    transform: translateY(-2px);
  }
}

.row-inactive td {
  background: #fff1f2;
}

.row-accepted td {
  background: #f0fdf4;
}

.row-pendiente-vinculo-venta td {
  background: #fff1f2;
}

.cliente-card.card-pendiente-vinculo-venta {
  background: #fff1f2;
}

#transactionLinkDialog .clinical-evaluation-modal.transaction-link-dialog-modal {
  display: flex;
  flex-direction: column;
  min-height: 0;
  width: min(760px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  height: auto;
  overflow: hidden;
}

#transactionLinkDialog .transaction-link-dialog-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

#transactionLinkDialog .transaction-link-dialog-body > .field > label {
  font-size: 12px;
}

#transactionLinkDialog .transaction-link-dialog-body > .field.full + .field.full {
  margin-top: 10px;
}

#transactionLinkDialog .clinical-evaluation-modal-footer.transaction-link-dialog-footer {
  flex-shrink: 0;
  margin: 0;
  position: static;
  padding: 12px 22px max(12px, env(safe-area-inset-bottom, 0px));
  border-top: 1px solid #e5e7eb;
  background: #ffffff;
  box-shadow: 0 -8px 18px rgba(15, 23, 42, 0.08);
  justify-content: flex-end;
}

.row-presupuesto-compartido td {
  background: #fffddd;
}

.cliente-card.card-presupuesto-compartido {
  background: #fffef0;
}

#resultadoPresupuestos table .col-estado-presupuesto .status-pill {
  font-size: 10px;
}

#resultadoConsentimientos table .col-estado-presupuesto .status-pill,
#resultadoConsentimientosPaciente table .col-estado-presupuesto .status-pill {
  font-size: 10px;
}

#resultadoServicios table .services-col-estado .status-pill {
  font-size: 10px;
}

.row-overpaid td {
  background: #fef9c3;
}

.row-reminder-overdue td {
  background: #fee2e2;
}

.row-reminder-sent td {
  background: #f0fdf4;
}

.row-reminder-soon td {
  background: #fef9c3;
}

.cliente-card.card-inactive {
  background: #fff1f2;
  border-color: #fecdd3;
}

.cliente-card.card-accepted {
  background: #f5fff8;
  border-color: #bbf7d0;
}

.cliente-card.card-overpaid {
  background: #fefce8;
  border-color: #fde68a;
}

.cliente-card.card-reminder-overdue {
  background: #fee2e2;
  border-color: #fca5a5;
}

.cliente-card.card-reminder-sent {
  background: #f0fdf4;
  border-color: #bbf7d0;
}

.cliente-card.card-reminder-soon {
  background: #fefce8;
  border-color: #fde68a;
}

.recordatorio-estado-tooltip {
  position: relative;
  display: inline-flex;
  align-items: center;
  cursor: default;
  outline: none;
}

.recordatorio-estado-tooltip-content {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  z-index: 20;
  display: none;
  min-width: 260px;
  max-width: min(360px, calc(100vw - 32px));
  padding: 10px 12px;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  background: #ffffff;
  color: #111827;
  box-shadow: 0 14px 26px rgba(15, 23, 42, 0.16);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
  text-align: left;
  white-space: pre-line;
}

.recordatorio-estado-tooltip:hover .recordatorio-estado-tooltip-content,
.recordatorio-estado-tooltip:focus .recordatorio-estado-tooltip-content,
.recordatorio-estado-tooltip:focus-within .recordatorio-estado-tooltip-content {
  display: block;
}

.cliente-card-cliente {
  padding: 16px 16px 14px;
  min-width: 0;
}

.cliente-card-top-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.cliente-card-top-row .cliente-card-nombre {
  flex: 1 1 0%;
  min-width: 0;
}

.cliente-card-cliente .cliente-card-menu-anchor {
  position: relative;
  top: auto;
  right: auto;
  flex: 0 0 auto;
  align-self: center;
  z-index: 6;
}

.cliente-card-body-row {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  gap: 10px;
  min-width: 0;
  margin-top: 10px;
}

.cliente-card-col-datos {
  flex: 1 1 0%;
  min-width: 0;
}

.cliente-card-col-datos > .cliente-card-meta-line {
  margin-top: 6px;
}

.cliente-card-col-datos > .cliente-card-meta-line:first-child {
  margin-top: 0;
}

.cliente-card-col-vendido {
  flex: 0 0 100px;
  width: 100px;
  min-width: 100px;
  max-width: 100px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-self: stretch;
}

.cliente-card-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.02em;
  flex-shrink: 0;
}

/* Clic "ver detalle" solo sobre avatar/texto, no sobre huecos del flex */
.cliente-card-cliente .cliente-card-avatar,
.cliente-card-cliente .cliente-card-nombre {
  pointer-events: none;
}

.cliente-card-cliente button.cliente-card-avatar-hit,
.cliente-card-cliente button.cliente-card-nombre-hit {
  pointer-events: auto;
  cursor: pointer;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  font: inherit;
  color: inherit;
  text-align: left;
}

.cliente-card-cliente button.cliente-card-avatar-hit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  text-align: center;
}

.cliente-card-cliente button.cliente-card-nombre-hit {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}

.cliente-card-avatar--tone-0 {
  background: #ede9fe;
  color: #5b21b6;
}

.cliente-card-avatar--tone-1 {
  background: #dbeafe;
  color: #1d4ed8;
}

.cliente-card-avatar--tone-2 {
  background: #d1fae5;
  color: #047857;
}

.cliente-card-avatar--tone-3 {
  background: #fef3c7;
  color: #b45309;
}

.cliente-card-avatar--tone-4 {
  background: #fce7f3;
  color: #9d174d;
}

.cliente-card-avatar--tone-5 {
  background: #e0f2fe;
  color: #0369a1;
}

.cliente-card-cliente .cliente-card-nombre {
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cliente-card-meta-line {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
  font-size: 14px;
  color: #334155;
  min-width: 0;
  overflow: hidden;
}

.cliente-card-meta-icon {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
}

.cliente-card-meta-icon svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.cliente-card-meta-icon svg circle[fill='currentColor'] {
  fill: currentColor;
  stroke: none;
}

.cliente-card-meta-value {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size:14px;
}

.cliente-card-meta-line-etiquetas {
  align-items: flex-start;
}

.cliente-card-meta-line-etiquetas .cliente-card-meta-icon {
  margin-top: 1px;
}

.cliente-card-meta-line-etiquetas .cliente-card-meta-value {
  overflow: visible;
  text-overflow: unset;
  white-space: normal;
}

.client-tags-chips-card {
  gap: 4px;
  margin-top: 0;
}

.client-tags-chips-card .client-tag-chip {
  font-size: 11px;
  padding: 4px 8px;
}

.status-pill {
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  font-weight: 700;
  padding: 5px 10px;
  line-height: 1.2;
  flex-shrink: 0;
}

.status-pill-presupuesto-borrador {
  background: #f1f5f9;
  color: #475569;
}

.status-pill-presupuesto-compartido {
  background: #fef9c3;
  color: #a16207;
}

.status-pill-presupuesto-aceptado {
  background: #c4f7d6;
  color: #166534;
}

.status-pill-presupuesto-anulado {
  background: #fee2e2;
  color: #991b1b;
}

.status-pill-presupuesto-neutral {
  background: #f1f5f9;
  color: #475569;
}

.status-pill-servicio-activo {
  background: #c4f7d6;
  color: #166534;
}

.status-pill-servicio-inactivo {
  background: #fee2e2;
  color: #991b1b;
}

.status-pill-transaccion-pendiente-neto {
  background: #fef9c3;
  color: #a16207;
}

.status-pill-tooltip-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  cursor: default;
  outline: none;
}

.status-pill-tooltip-content {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 8px);
  z-index: 20;
  display: none;
  min-width: 0;
  max-width: min(360px, calc(100vw - 32px));
  padding: 8px 10px;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  background: #ffffff;
  color: #111827;
  box-shadow: 0 14px 26px rgba(15, 23, 42, 0.16);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
  text-align: center;
  white-space: nowrap;
  transform: translateX(-50%);
}

.status-pill-tooltip-wrap:hover .status-pill-tooltip-content,
.status-pill-tooltip-wrap:focus .status-pill-tooltip-content,
.status-pill-tooltip-wrap:focus-within .status-pill-tooltip-content {
  display: block;
}

.table-responsive .status-pill-tooltip-content {
  display: none !important;
}

.status-pill-tooltip-portal {
  position: fixed;
  z-index: 1300;
  display: none;
  min-width: 0;
  max-width: min(360px, calc(100vw - 32px));
  padding: 8px 10px;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  background: #ffffff;
  color: #111827;
  box-shadow: 0 14px 26px rgba(15, 23, 42, 0.16);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
  text-align: center;
  white-space: nowrap;
  pointer-events: none;
}

.status-pill-tooltip-portal.is-visible {
  display: block;
}

.budget-bitacora-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 12px;
  background: #f8fafc;
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
  cursor: pointer;
  text-align: left;
  gap: 10px;
}

.budget-bitacora-toggle:hover {
  background: #f1f5f9;
}

.budget-bitacora-chevron {
  flex-shrink: 0;
  transition: transform 0.2s ease;
  font-size: 11px;
  color: #64748b;
}

.budget-bitacora-wrap.is-open .budget-bitacora-chevron {
  transform: rotate(180deg);
}

.budget-bitacora-panel {
  display: none;
  margin-top: 12px;
}

.budget-bitacora-wrap.is-open .budget-bitacora-panel {
  display: block;
}

/* #id + .budget-bitacora-wrap gana a .budget-section (margin-top: 0) */
#budgetBitacoraSection.budget-bitacora-wrap,
#ventaBitacoraSection.budget-bitacora-wrap {
  margin-top: 10px;
  padding-top: 80px;
  border-top: 1px solid rgba(148, 163, 184, 0.35);
}

.budget-bitacora-timeline {
  position: relative;
  padding-left: 14px;
  border-left: 2px solid rgba(148, 163, 184, 0.45);
  margin-left: 8px;
}

.budget-bitacora-entry {
  position: relative;
  padding-bottom: 18px;
  padding-left: 8px;
}

.budget-bitacora-entry:last-child {
  padding-bottom: 6px;
}

.budget-bitacora-entry::before {
  content: '';
  position: absolute;
  left: -22px;
  top: 4px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #2563eb;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.35);
}

.budget-bitacora-entry-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}

.budget-bitacora-entry-meta {
  font-size: 12px;
  color: #64748b;
  width: 100%;
}

.budget-bitacora-entry-actions {
  margin-top: 6px;
}

.status-pill-ledger-crear { background: #e0e7ff; color: #3730a3; }
.status-pill-ledger-actualizar { background: #dbeafe; color: #1e40af; }
.status-pill-ledger-compartir { background: #fef9c3; color: #a16207; }
.status-pill-ledger-anular { background: #fee2e2; color: #991b1b; }
.status-pill-ledger-venta { background: #c4f7d6; color: #166534; }

.budget-bitacora-snapshot-body {
  max-height: min(60vh, 420px);
  overflow-x: hidden;
  overflow-y: auto;
  font-size: 13px;
  line-height: 1.45;
  text-align: left;
}

.budget-bitacora-snapshot-summary {
  display: grid;
  gap: 8px;
}

.budget-bitacora-snapshot-detalle-wrap {
  margin-top: 14px;
}

.budget-bitacora-snapshot-detalle-title {
  font-weight: 700;
  font-size: 13px;
  margin-bottom: 8px;
  color: #0f172a;
}

.budget-bitacora-snapshot-detalle {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 12px;
  background: #fff;
}

.budget-bitacora-snapshot-detalle th,
.budget-bitacora-snapshot-detalle td {
  border: 1px solid #e2e8f0;
  padding: 7px 8px;
  vertical-align: top;
  box-sizing: border-box;
}

.budget-bitacora-snapshot-detalle th {
  background: #f8fafc;
  font-weight: 600;
  text-align: left;
  white-space: nowrap;
}

.budget-bitacora-snapshot-detalle td.money-col,
.budget-bitacora-snapshot-detalle th.money-col {
  text-align: right;
}

.budget-bitacora-snapshot-detalle th.budget-bitacora-col-cant,
.budget-bitacora-snapshot-detalle td.budget-bitacora-col-cant {
  width: 50px;
  min-width: 50px;
  max-width: 50px;
  box-sizing: border-box;
}

.budget-bitacora-snapshot-detalle th.budget-bitacora-col-idx,
.budget-bitacora-snapshot-detalle td.budget-bitacora-col-idx {
  width: 40px;
  max-width: 40px;
  box-sizing: border-box;
  text-align: center;
}

.budget-bitacora-snapshot-detalle th.budget-bitacora-col-servicio,
.budget-bitacora-snapshot-detalle td.budget-bitacora-col-servicio {
  width: auto;
  min-width: 0;
  word-break: break-word;
}

.budget-bitacora-snapshot-detalle th.budget-bitacora-col-servicio {
  white-space: normal;
}

.budget-bitacora-snapshot-detalle th.budget-bitacora-col-money-fixed {
  white-space: normal;
}

.budget-bitacora-snapshot-detalle th.budget-bitacora-col-money-fixed,
.budget-bitacora-snapshot-detalle td.budget-bitacora-col-money-fixed {
  width: 120px;
  min-width: 120px;
  max-width: 120px;
  box-sizing: border-box;
}

.budget-bitacora-snapshot-svc-main {
  font-weight: 600;
  color: #0f172a;
}

#presupuestoBitacoraSnapshotDialog .budget-bitacora-snapshot-detalle-wrap .table-responsive {
  overflow-x: hidden;
  max-width: 100%;
  box-sizing: border-box;
}

#presupuestoBitacoraSnapshotDialog .budget-bitacora-snapshot-detalle {
  max-width: 100%;
}

#presupuestoBitacoraSnapshotDialog .dialog {
  max-width: 720px;
  width: calc(100vw - 32px);
}

#presupuestoBitacoraSnapshotDialog .presupuesto-bitacora-snapshot-dialog-header {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 34px;
  margin-bottom: 8px;
}

#presupuestoBitacoraSnapshotDialog .presupuesto-bitacora-snapshot-dialog-header h3 {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
  font-size: 20px;
  line-height: 1.25;
  padding-right: 4px;
}

#presupuestoBitacoraSnapshotDialog .presupuesto-bitacora-snapshot-dialog-header .clinical-evaluation-modal-close {
  flex-shrink: 0;
  margin-left: auto;
}

.presupuesto-card .presupuesto-card-row-estado {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 10px;
  min-width: 0;
  overflow: hidden;
}

.presupuesto-card .presupuesto-card-cliente-block {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 1 1 0%;
}

.presupuesto-card .presupuesto-card-cliente-block .cliente-card-meta-value {
  min-width: 0;
}

.presupuesto-card .presupuesto-card-row-estado > .status-pill {
  flex-shrink: 0;
  white-space: nowrap;
}

.presupuesto-card .presupuesto-card-row-estado .cliente-card-meta-line {
  margin-top: 0;
  flex: 1 1 0%;
  min-width: 0;
}

.presupuesto-card .presupuesto-card-row-estado .cliente-card-meta-line .cliente-card-meta-value {
  min-width: 0;
}

.presupuesto-card .presupuesto-card-clear-menu {
  margin-right: 25px;
}

.venta-card .venta-card-clear-menu {
  margin-right: 25px;
}

.venta-card .venta-card-row-cliente {
  display: flex;
  align-items: center;
  margin-top: 10px;
  min-width: 0;
  overflow: hidden;
}

.venta-card .venta-card-row-cliente .presupuesto-card-cliente-block {
  flex: 1 1 0%;
  min-width: 0;
}

.venta-card .venta-card-row-cliente .presupuesto-card-cliente-block .cliente-card-meta-value {
  min-width: 0;
}

.venta-card .cliente-card-meta-line.venta-card-row-fecha {
  margin-top: 8px;
  min-width: 0;
  overflow: hidden;
}

.venta-card .cliente-card-meta-line.venta-card-row-fecha .cliente-card-meta-value {
  min-width: 0;
}

.venta-card .venta-card-row-metric {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 8px;
  min-width: 0;
  overflow: hidden;
}

.venta-card .venta-card-row-metric .cliente-card-meta-line {
  margin-top: 0;
  flex: 1 1 0%;
  min-width: 0;
}

.venta-card .venta-card-row-metric .venta-card-metric-fixed-label {
  flex-shrink: 0;
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
}

.venta-card .venta-card-row-metric .venta-card-concepto-val {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.venta-card .venta-card-row-metric .venta-card-monto-val {
  flex: 0 0 auto;
  flex-shrink: 0;
  white-space: nowrap;
  text-align: right;
  font-size: 16px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #0f172a;
}

.venta-card .venta-card-row-metric .venta-card-monto-val.venta-card-monto-val--cobrado {
  color: #047857;
}

.venta-card .venta-card-row-metric .venta-card-monto-val.venta-card-monto-val--saldo {
  color: #b91c1c;
}

.venta-card.consentimiento-card .cliente-card-header {
  margin-bottom: 0;
}

.venta-card.consentimiento-card .presupuesto-card-row-estado {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 8px;
  min-width: 0;
  overflow: hidden;
}

.venta-card.consentimiento-card .presupuesto-card-row-estado .cliente-card-meta-line {
  margin-top: 0;
  flex: 1 1 0%;
  min-width: 0;
}

.venta-card.consentimiento-card .presupuesto-card-row-estado > .status-pill {
  flex-shrink: 0;
  white-space: nowrap;
}

.venta-card.consentimiento-card .presupuesto-card-cliente-block .cliente-card-meta-value {
  min-width: 0;
}

.transaccion-card .transaccion-card-titulo {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.transaccion-card .transaccion-card-titulo-texto {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.transaccion-card .transaccion-card-titulo-hit {
  pointer-events: auto;
  display: inline-block;
  width: auto;
  max-width: 100%;
  vertical-align: top;
  font: inherit;
  font-weight: inherit;
  text-align: inherit;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: inherit;
  cursor: pointer;
}

.transaccion-card .venta-card-monto-val.transaccion-card-monto-val .status-pill {
  font-size: 10px;
}

.transaccion-card .transaccion-card-vinculo-btn {
  flex: 0 0 auto;
}

.card-action-button.card-action-vinculo-pendiente {
  color: #111827;
}

.card-action-button.card-action-vinculo-pendiente:hover {
  background: #fef3c7;
}

.card-action-button.card-action-vinculo-pendiente .card-action-icon {
  width: 24px;
  height: 24px;
  min-width: 24px;
  background: #ffd400;
  border-radius: 5px;
  color: #111827;
}

.card-action-button.card-action-vinculo-pendiente .card-action-icon svg {
  width: 14px;
  height: 14px;
}

.transaccion-card .venta-card-row-metric .transaccion-card-monto-val {
  color: #0f172a;
}

/* Ventas (tabla desktop): mismos tonos que cards */
#vistaVentas #resultadoVentas .table-responsive.table-desktop td.money-col.venta-cobrado-col {
  color: #047857;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

#vistaVentas #resultadoVentas .table-responsive.table-desktop td.money-col.venta-saldo-col {
  color: #b91c1c;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* Historial ventas del paciente (tabla desktop): mismos tonos que cards */
#vistaRegistro #resultadoHistorialVentasCliente .table-responsive.table-desktop td.money-col.historial-venta-cobrado-col {
  color: #047857;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

#vistaRegistro #resultadoHistorialVentasCliente .table-responsive.table-desktop td.money-col.historial-venta-saldo-col {
  color: #b91c1c;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.presupuesto-card .presupuesto-card-row-fecha-monto {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 8px;
  min-width: 0;
  overflow: hidden;
}

.presupuesto-card .presupuesto-card-row-fecha-monto .cliente-card-meta-line {
  margin-top: 0;
  flex: 1 1 0%;
  min-width: 0;
}

.presupuesto-card .presupuesto-card-row-fecha-monto .presupuesto-card-cliente-block {
  flex: 1 1 0%;
  min-width: 0;
}

.presupuesto-card .presupuesto-card-row-fecha-monto .presupuesto-card-cliente-block .cliente-card-meta-value {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.presupuesto-card .presupuesto-card-row-fecha-monto .presupuesto-card-monto {
  flex: 0 0 auto;
  flex-shrink: 0;
  margin-top: 0;
  text-align: right;
  white-space: nowrap;
  font-size: 16px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #0f172a;
}

.cliente-card-ventas-badge {
  width: 100%;
  max-width: 100px;
  box-sizing: border-box;
  background: #ecfdf5;
  border: 1px solid rgba(16, 185, 129, 0.28);
  border-radius: 10px;
  padding: 6px 8px;
  text-align: center;
  flex-shrink: 0;
}

.cliente-card-ventas-label {
  font-size: 10px;
  font-weight: 600;
  color: #047857;
  letter-spacing: 0.02em;
  line-height: 1.15;
}

.cliente-card-ventas-monto {
  margin-top: 3px;
  font-size: 14px;
  font-weight: 700;
  color: #064e3b;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.servicio-card .venta-card-row-metric:first-of-type {
  margin-top: 10px;
}

/* Flex solo fuera de celdas: en <td class="table-actions"> rompe la altura de fila del modelo tabla. */
.table-actions:not(td) {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-height: 24px;
}

td.table-actions.table-actions-col > .icon-button + .icon-button {
  margin-left: 4px;
}

.icon-button {
  align-items: center;
  background: #2563eb;
  border: none;
  border-radius: 5px;
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  height: 24px;
  justify-content: center;
  padding: 0;
  text-decoration: none;
  width: 24px;
}

.icon-button:hover {
  background: #1d4ed8;
}

.icon-button.secondary {
  background: #6b7280;
}

.icon-button.secondary:hover {
  background: #4b5563;
}

.icon-button.danger {
  background: #dc2626;
}

.icon-button.danger:hover {
  background: #b91c1c;
}

.icon-button.success {
  background: #16a34a;
}

.icon-button.success:hover {
  background: #15803d;
}

.icon-button.icon-button-estado-pending {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.icon-button.icon-button-estado-pending.is-busy,
.icon-button.icon-button-estado-pending.is-busy:hover {
  background: #6b7280 !important;
}

.icon-button.icon-button-estado-pending.is-busy svg {
  opacity: 0;
  visibility: hidden;
}

.icon-button.icon-button-estado-pending.is-busy::after {
  animation: icon-button-estado-dot-pulse 1s ease-in-out infinite;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 50%;
  content: '';
  height: 6px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 6px;
  z-index: 2;
}

@keyframes icon-button-estado-dot-pulse {
  0%,
  100% {
    opacity: 0.35;
    transform: translate(-50%, -50%) scale(0.82);
  }

  50% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

.icon-button.icon-button-estado-pending.is-done,
.icon-button.icon-button-estado-pending.is-done:hover {
  background: var(--estado-target, #16a34a) !important;
}

.icon-button.icon-button-estado-pending.is-done svg {
  opacity: 1;
  position: relative;
  visibility: visible;
  z-index: 1;
}

.icon-button.icon-button-estado-pending.is-done::after {
  display: none;
}

.icon-button.warning {
  background: #ffd400;
  color: #111827;
}

.icon-button.warning:hover {
  background: #b39500;
  color: #111827;
}

.icon-button svg:not(.void-anular-icon) {
  display: block;
  fill: currentColor;
  height: 14px;
  width: 14px;
}

.icon-button svg.void-anular-icon {
  display: block;
  height: 14px;
  width: 14px;
}

svg.void-anular-icon {
  display: block;
}

.icon-button.danger svg.void-anular-icon,
.toolbar-buttons .toolbar-filter-toggle svg.void-anular-icon,
.card-action-icon svg.void-anular-icon {
  fill: none;
}

svg.void-anular-icon g.void-anular-x rect {
  fill: #dc2626;
}

.icon-button.danger svg.void-anular-icon g.void-anular-x rect {
  fill: #ffffff;
}

.card-action-button.danger svg.void-anular-icon g.void-anular-x rect {
  fill: currentColor;
}

.icon-button.action-accent-share {
  background: #0d9488;
  color: #ffffff;
}

.icon-button.action-accent-share:hover {
  background: #0f766e;
}

.icon-button.action-reminder-create {
  background: #f59e0b;
  color: #ffffff;
}

.icon-button.action-reminder-create:hover {
  background: #d97706;
  color: #ffffff;
}

.icon-button.action-accent-venta-detalle {
  background: #0284c7;
  color: #ffffff;
}

.icon-button.action-accent-venta-detalle:hover {
  background: #0369a1;
}

.icon-button.action-accent-evaluacion-edit {
  background: #2563eb;
  color: #ffffff;
}

.icon-button.action-accent-evaluacion-edit:hover {
  background: #1d4ed8;
  color: #ffffff;
}

.icon-button.action-placeholder {
  visibility: hidden;
  pointer-events: none;
}

td.table-actions.table-actions-col {
  display: table-cell;
  vertical-align: middle;
  text-align: right;
  white-space: nowrap;
  box-sizing: border-box;
  line-height: 0;
}

.table-actions-col {
  width: 156px;
  min-width: 156px;
  max-width: 156px;
  vertical-align: middle;
}

th.table-actions-col {
  text-align: left;
}

#vistaClientes .table-responsive.table-desktop thead th,
#vistaPresupuestos .table-responsive.table-desktop thead th,
#vistaVentas .table-responsive.table-desktop thead th,
#vistaTransacciones .table-responsive.table-desktop thead th,
#vistaCitas .table-responsive.table-desktop thead th,
#vistaConsentimientosInformados .table-responsive.table-desktop thead th,
#resultadoConsentimientosPaciente .table-responsive.table-desktop thead th,
#resultadoHistorialCitasCliente .table-responsive.table-desktop thead th,
#resultadoHistorialVentasCliente .table-responsive.table-desktop thead th,
#resultadoHistorialPagosCliente .table-responsive.table-desktop thead th {
  box-sizing: border-box;
  height: 37px;
  min-height: 37px;
  max-height: 37px;
  padding: 4px 8px;
  vertical-align: middle;
  overflow: hidden;
}

#vistaClientes .table-responsive.table-desktop thead th .table-sortable-inner,
#vistaPresupuestos .table-responsive.table-desktop thead th .table-sortable-inner,
#vistaVentas .table-responsive.table-desktop thead th .table-sortable-inner,
#vistaTransacciones .table-responsive.table-desktop thead th .table-sortable-inner,
#vistaCitas .table-responsive.table-desktop thead th .table-sortable-inner,
#vistaConsentimientosInformados .table-responsive.table-desktop thead th .table-sortable-inner,
#resultadoConsentimientosPaciente .table-responsive.table-desktop thead th .table-sortable-inner,
#resultadoHistorialCitasCliente .table-responsive.table-desktop thead th .table-sortable-inner,
#resultadoHistorialVentasCliente .table-responsive.table-desktop thead th .table-sortable-inner,
#resultadoHistorialPagosCliente .table-responsive.table-desktop thead th .table-sortable-inner {
  height: 100%;
  min-height: 0;
}

#vistaClientes .table-responsive.table-desktop tbody tr.pacientes-row-clickable {
  cursor: pointer;
  height: 37px;
  transition: background-color 0.15s ease;
}

#vistaClientes .table-responsive.table-desktop tbody tr.pacientes-row-clickable td {
  box-sizing: border-box;
  height: 37px;
  min-height: 37px;
  vertical-align: middle;
}

#vistaClientes .table-responsive.table-desktop tbody tr.pacientes-row-clickable:hover td {
  background: #f3f4f6;
}

#vistaClientes .table-responsive.table-desktop tbody tr.pacientes-row-clickable.row-inactive:hover td {
  background: #fde4e7;
}

#vistaPresupuestos .table-responsive.table-desktop tbody tr.presupuestos-row-clickable {
  cursor: pointer;
  height: 37px;
  transition: background-color 0.15s ease;
}

#vistaPresupuestos .table-responsive.table-desktop tbody tr.presupuestos-row-clickable td {
  box-sizing: border-box;
  height: 37px;
  min-height: 37px;
  vertical-align: middle;
}

#vistaPresupuestos .table-responsive.table-desktop tbody tr.presupuestos-row-clickable:hover td {
  background: #f3f4f6;
}

#vistaPresupuestos .table-responsive.table-desktop tbody tr.presupuestos-row-clickable.row-inactive:hover td {
  background: #fde4e7;
}

#vistaPresupuestos .table-responsive.table-desktop tbody tr.presupuestos-row-clickable.row-accepted:hover td {
  background: #e8f5e9;
}

#vistaPresupuestos .table-responsive.table-desktop tbody tr.presupuestos-row-clickable.row-presupuesto-compartido:hover td {
  background: #e8f0fe;
}

#vistaVentas .table-responsive.table-desktop tbody tr.ventas-row-clickable,
#resultadoHistorialVentasCliente .table-responsive.table-desktop tbody tr.ventas-row-clickable {
  cursor: pointer;
  height: 37px;
  transition: background-color 0.15s ease;
}

#vistaVentas .table-responsive.table-desktop tbody tr.ventas-row-clickable td,
#resultadoHistorialVentasCliente .table-responsive.table-desktop tbody tr.ventas-row-clickable td {
  box-sizing: border-box;
  height: 37px;
  min-height: 37px;
  vertical-align: middle;
}

#vistaVentas .table-responsive.table-desktop tbody tr.ventas-row-clickable:hover td,
#resultadoHistorialVentasCliente .table-responsive.table-desktop tbody tr.ventas-row-clickable:hover td {
  background: #f3f4f6;
}

#vistaVentas .table-responsive.table-desktop tbody tr.ventas-row-clickable.row-inactive:hover td,
#resultadoHistorialVentasCliente .table-responsive.table-desktop tbody tr.ventas-row-clickable.row-inactive:hover td {
  background: #fde4e7;
}

#vistaVentas .table-responsive.table-desktop tbody tr.ventas-row-clickable.row-accepted:hover td,
#resultadoHistorialVentasCliente .table-responsive.table-desktop tbody tr.ventas-row-clickable.row-accepted:hover td {
  background: #e8f5e9;
}

#vistaVentas .table-responsive.table-desktop tbody tr.ventas-row-clickable.row-overpaid:hover td,
#resultadoHistorialVentasCliente .table-responsive.table-desktop tbody tr.ventas-row-clickable.row-overpaid:hover td {
  background: #fde68a;
}

#vistaCitas .table-responsive.table-desktop tbody tr.citas-row-clickable,
#resultadoHistorialCitasCliente .table-responsive.table-desktop tbody tr.citas-row-clickable {
  cursor: pointer;
  height: 37px;
  transition: background-color 0.15s ease;
}

#vistaCitas .table-responsive.table-desktop tbody tr.citas-row-clickable td,
#resultadoHistorialCitasCliente .table-responsive.table-desktop tbody tr.citas-row-clickable td {
  box-sizing: border-box;
  height: 37px;
  min-height: 37px;
  vertical-align: middle;
}

#vistaCitas .table-responsive.table-desktop tbody tr.citas-row-clickable:hover td,
#resultadoHistorialCitasCliente .table-responsive.table-desktop tbody tr.citas-row-clickable:hover td {
  background: #f3f4f6;
}

#vistaCitas .table-responsive.table-desktop tbody tr.citas-row-clickable.row-inactive,
#resultadoHistorialCitasCliente .table-responsive.table-desktop tbody tr.citas-row-clickable.row-inactive {
  cursor: default;
}

#vistaCitas .table-responsive.table-desktop tbody tr.citas-row-clickable.row-inactive:hover td,
#resultadoHistorialCitasCliente .table-responsive.table-desktop tbody tr.citas-row-clickable.row-inactive:hover td {
  background: #fde4e7;
}

#vistaConsentimientosInformados .table-responsive.table-desktop tbody tr.consentimientos-row-clickable,
#resultadoConsentimientosPaciente .table-responsive.table-desktop tbody tr.consentimientos-row-clickable {
  cursor: pointer;
  height: 37px;
  transition: background-color 0.15s ease;
}

#vistaConsentimientosInformados .table-responsive.table-desktop tbody tr.consentimientos-row-clickable td,
#resultadoConsentimientosPaciente .table-responsive.table-desktop tbody tr.consentimientos-row-clickable td {
  box-sizing: border-box;
  height: 37px;
  min-height: 37px;
  vertical-align: middle;
}

#vistaConsentimientosInformados .table-responsive.table-desktop tbody tr.consentimientos-row-clickable:hover td,
#resultadoConsentimientosPaciente .table-responsive.table-desktop tbody tr.consentimientos-row-clickable:hover td {
  background: #f3f4f6;
}

#vistaConsentimientosInformados .table-responsive.table-desktop tbody tr.consentimientos-row-clickable.row-inactive:hover td,
#resultadoConsentimientosPaciente .table-responsive.table-desktop tbody tr.consentimientos-row-clickable.row-inactive:hover td {
  background: #fde4e7;
}

#vistaConsentimientosInformados .table-responsive.table-desktop tbody tr.consentimientos-row-clickable.row-accepted:hover td,
#resultadoConsentimientosPaciente .table-responsive.table-desktop tbody tr.consentimientos-row-clickable.row-accepted:hover td {
  background: #e8f5e9;
}

#vistaConsentimientosInformados .table-responsive.table-desktop tbody tr.consentimientos-row-clickable.row-presupuesto-compartido:hover td,
#resultadoConsentimientosPaciente .table-responsive.table-desktop tbody tr.consentimientos-row-clickable.row-presupuesto-compartido:hover td {
  background: #e8f0fe;
}

#vistaTransacciones .table-responsive.table-desktop tbody tr.transacciones-row-clickable,
#resultadoHistorialPagosCliente .table-responsive.table-desktop tbody tr.transacciones-row-clickable {
  cursor: pointer;
  height: 37px;
}

#vistaTransacciones .table-responsive.table-desktop tbody tr.transacciones-row-clickable td,
#resultadoHistorialPagosCliente .table-responsive.table-desktop tbody tr.transacciones-row-clickable td {
  box-sizing: border-box;
  height: 37px;
  min-height: 37px;
  vertical-align: middle;
  transition: background-color 0.15s ease;
}

#vistaTransacciones .table-responsive.table-desktop tbody tr.transacciones-row-clickable .status-pill-tooltip-wrap,
#resultadoHistorialPagosCliente .table-responsive.table-desktop tbody tr.transacciones-row-clickable .status-pill-tooltip-wrap {
  cursor: inherit;
}

#vistaTransacciones .table-responsive.table-desktop tbody tr.transacciones-row-clickable:is(:hover, :has(> td:hover)) td,
#resultadoHistorialPagosCliente .table-responsive.table-desktop tbody tr.transacciones-row-clickable:is(:hover, :has(> td:hover)) td {
  background: #f3f4f6;
}

#vistaTransacciones .table-responsive.table-desktop tbody tr.transacciones-row-clickable.row-pendiente-vinculo-venta:is(:hover, :has(> td:hover)) td,
#resultadoHistorialPagosCliente .table-responsive.table-desktop tbody tr.transacciones-row-clickable.row-pendiente-vinculo-venta:is(:hover, :has(> td:hover)) td {
  background: #fde4e7;
}

#configOdontologosListaBloque .table-responsive.table-desktop th.table-actions-col,
#configOdontologosListaBloque .table-responsive.table-desktop td.table-actions.table-actions-col {
  width: 96px;
  min-width: 96px;
  max-width: 96px;
}

/* Estado clientes (vista inactivos): pastilla como servicios */
#vistaClientes .table-responsive.table-desktop tbody td.services-col-estado {
  overflow: visible;
}

#vistaClientes .table-responsive.table-desktop th.services-col-estado,
#vistaClientes .table-responsive.table-desktop td.services-col-estado {
  width: 108px;
  min-width: 108px;
  max-width: 108px;
}

/* Ventas: 3 slots ícono (mínimo = ancho equivalente a 3 botones: 72 + 2×4 gap + 16 padding ≈ 96px) */
#vistaVentas .table-responsive.table-desktop th.table-actions-col,
#vistaVentas .table-responsive.table-desktop td.table-actions.table-actions-col {
  width: 96px;
  min-width: 96px;
  max-width: 96px;
}

/* Citas: sin columna acciones (fila clickeable) */
#vistaCitas .table-responsive.table-desktop th.col-estado-cita,
#vistaCitas .table-responsive.table-desktop td.col-estado-cita,
#resultadoHistorialCitasCliente .table-responsive.table-desktop th.col-estado-cita,
#resultadoHistorialCitasCliente .table-responsive.table-desktop td.col-estado-cita {
  width: 108px;
  min-width: 108px;
  max-width: 108px;
}

/* Servicios: 4 slots (24×4 + 3×4 gap + padding 8+8 ≈ 124px) */
#vistaServicios .table-responsive.table-desktop th.table-actions-col,
#vistaServicios .table-responsive.table-desktop td.table-actions.table-actions-col {
  width: 124px;
  min-width: 124px;
  max-width: 124px;
}

/* Estado servicios: pills; ancho y overflow para no recortar la pastilla */
#vistaServicios .table-responsive.table-desktop tbody td.services-col-estado {
  overflow: visible;
}

#vistaServicios .table-responsive.table-desktop th.services-col-estado,
#vistaServicios .table-responsive.table-desktop td.services-col-estado {
  width: 108px;
  min-width: 108px;
  max-width: 108px;
}

/* Presupuestos: 3 slots (96px) */
#vistaPresupuestos .table-responsive.table-desktop th.table-actions-col,
#vistaPresupuestos .table-responsive.table-desktop td.table-actions.table-actions-col {
  width: 96px;
  min-width: 96px;
  max-width: 96px;
}

/* Estado presupuestos: pills sin recorte ni ellipsis de celda */
#vistaPresupuestos .table-responsive.table-desktop th.col-estado-presupuesto,
#vistaPresupuestos .table-responsive.table-desktop td.col-estado-presupuesto {
  width: 108px;
  min-width: 108px;
  max-width: 108px;
}

/* Consentimientos: columna estado */
#vistaConsentimientosInformados .table-responsive.table-desktop th.col-estado-presupuesto,
#vistaConsentimientosInformados .table-responsive.table-desktop td.col-estado-presupuesto,
#resultadoConsentimientosPaciente .table-responsive.table-desktop th.col-estado-presupuesto,
#resultadoConsentimientosPaciente .table-responsive.table-desktop td.col-estado-presupuesto {
  width: 108px;
  min-width: 108px;
  max-width: 108px;
}

#vistaRegistro #resultadoHistorialPagosCliente .table-responsive.table-desktop th.table-actions-col,
#vistaRegistro #resultadoHistorialPagosCliente .table-responsive.table-desktop td.table-actions.table-actions-col {
  width: 48px;
  min-width: 48px;
  max-width: 48px;
}

#vistaRegistro #resultadoHistorialPagosCliente .table-responsive.table-desktop td.table-actions.table-actions-col {
  text-align: center;
  padding-left: 4px;
  padding-right: 4px;
}

/* Transacciones: 1 slot (24px botón + padding celda) */
#vistaTransacciones .table-responsive.table-desktop th.table-actions-col,
#vistaTransacciones .table-responsive.table-desktop td.table-actions.table-actions-col {
  width: 48px;
  min-width: 48px;
  max-width: 48px;
}

#vistaTransacciones .table-responsive.table-desktop td.table-actions.table-actions-col {
  text-align: center;
  padding-left: 4px;
  padding-right: 4px;
}

/* Gastos operativos proyectados: ancho fijo para 3 botones */
#vistaFlujoCaja #resultadoGastosFlujoCaja .table-responsive.table-desktop th.gastos-flujo-caja-actions-col.table-actions-col,
#vistaFlujoCaja #resultadoGastosFlujoCaja .table-responsive.table-desktop td.table-actions.gastos-flujo-caja-actions-col.table-actions-col {
  width: 96px;
  min-width: 96px;
  max-width: 96px;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico {
  margin: 0 0 16px;
  padding: 12px 14px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 12px;
  background: #f9fafb;
  box-sizing: border-box;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin-bottom: 8px;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-title {
  color: #374151;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-anio-field {
  flex: 0 0 auto;
  min-width: 92px;
  max-width: 120px;
  margin: 0;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-anio-field select {
  min-height: 36px;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-chart {
  width: 100%;
  max-height: 150px;
  height: 150px;
  overflow: hidden;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-chart svg {
  display: block;
  width: 100%;
  height: 100%;
  max-height: 150px;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-line {
  vector-effect: non-scaling-stroke;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-baseline {
  stroke: rgba(15, 23, 42, 0.16);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-axis-y {
  stroke: rgba(15, 23, 42, 0.14);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-grid {
  stroke: rgba(15, 23, 42, 0.06);
  stroke-width: 1;
  stroke-dasharray: 3 3;
  vector-effect: non-scaling-stroke;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-y {
  fill: #6b7280;
  font-size: 10px;
  font-weight: 600;
  pointer-events: none;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-mes {
  fill: #6b7280;
  font-size: 10px;
  font-weight: 600;
  pointer-events: none;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-hit {
  cursor: pointer;
}

.flujo-caja-gastos-grafico-tooltip {
  z-index: 12060;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-total {
  margin-top: 6px;
  color: #6b7280;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  text-align: right;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-empty {
  width: 100%;
  height: 100%;
  border-radius: 8px;
  background: linear-gradient(180deg, #f3f4f6 0%, #e5e7eb 100%);
  opacity: 0.45;
}

body.is-mobile #panelFlujoCajaGastos .flujo-caja-gastos-grafico {
  margin-bottom: 12px;
  padding: 10px 12px;
}

body.is-mobile #panelFlujoCajaGastos .flujo-caja-gastos-grafico-header {
  gap: 6px 10px;
}

body.is-mobile #panelFlujoCajaGastos .flujo-caja-gastos-grafico-anio-field {
  min-width: 88px;
}

body.is-mobile #panelFlujoCajaGastos .flujo-caja-gastos-grafico-anio-field select {
  min-height: 40px;
}

body.is-mobile #panelFlujoCajaGastos .flujo-caja-gastos-grafico-y {
  font-size: 9px;
}

body.is-mobile #panelFlujoCajaGastos .flujo-caja-gastos-grafico-mes {
  font-size: 9px;
}

#panelFlujoCajaResumen .flujo-caja-resumen-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 24px 12px;
}

.flujo-caja-resumen-contenido {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.flujo-caja-resumen-card {
  padding: 16px 18px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.flujo-caja-resumen-card-colapsable {
  padding: 0;
  overflow: hidden;
}

.flujo-caja-resumen-card-head {
  border-bottom: 1px solid #eef2f7;
}

.flujo-caja-resumen-card-colapsable.is-collapsed .flujo-caja-resumen-card-head {
  border-bottom: 0;
}

.flujo-caja-resumen-card-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 14px 16px;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
  color: inherit;
  font: inherit;
}

.flujo-caja-resumen-card-toggle-text {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.flujo-caja-resumen-card-title {
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.3;
}

.flujo-caja-resumen-card-subtitle {
  font-size: 13px;
  color: #6b7280;
  line-height: 1.4;
}

.flujo-caja-resumen-card-chevron {
  flex-shrink: 0;
  font-size: 18px;
  line-height: 1;
  color: #6b7280;
  transition: transform 0.15s ease;
}

.flujo-caja-resumen-card-colapsable.is-collapsed .flujo-caja-resumen-card-chevron {
  transform: rotate(-90deg);
}

.flujo-caja-resumen-card-body {
  padding: 0 16px 16px;
}

.flujo-caja-resumen-card-colapsable.is-collapsed .flujo-caja-resumen-card-body {
  display: none;
}

.flujo-caja-resumen-card-colapsable .flujo-caja-resumen-table-wrap {
  margin-bottom: 0;
}

#vistaFlujoCaja .flujo-caja-panels:has(#panelFlujoCajaResumen.active) {
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

#panelFlujoCajaResumen.active {
  margin-bottom: 0;
}

#panelFlujoCajaResumen .flujo-caja-resumen-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

#panelFlujoCajaResumen .flujo-caja-resumen-toolbar-left {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

#panelFlujoCajaResumen .flujo-caja-resumen-anio-field {
  min-width: 92px;
  max-width: 120px;
  margin: 0;
}

#panelFlujoCajaResumen .flujo-caja-gastos-grafico-chart {
  width: 100%;
  max-height: 180px;
  height: 180px;
  overflow: hidden;
}

#panelFlujoCajaResumen .flujo-caja-gastos-grafico-chart svg {
  display: block;
  width: 100%;
  height: 100%;
  max-height: 180px;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-baseline,
#panelFlujoCajaResumen .flujo-caja-gastos-grafico-baseline {
  stroke: rgba(15, 23, 42, 0.16);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-axis-y,
#panelFlujoCajaResumen .flujo-caja-gastos-grafico-axis-y {
  stroke: rgba(15, 23, 42, 0.14);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-grid,
#panelFlujoCajaResumen .flujo-caja-gastos-grafico-grid {
  stroke: rgba(15, 23, 42, 0.06);
  stroke-width: 1;
  stroke-dasharray: 3 3;
  vector-effect: non-scaling-stroke;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-y,
#panelFlujoCajaResumen .flujo-caja-gastos-grafico-y {
  fill: #6b7280;
  font-size: 10px;
  font-weight: 600;
  pointer-events: none;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-mes,
#panelFlujoCajaResumen .flujo-caja-gastos-grafico-mes {
  fill: #6b7280;
  font-size: 10px;
  font-weight: 600;
  pointer-events: none;
}

#panelFlujoCajaGastos .flujo-caja-gastos-grafico-hit,
#panelFlujoCajaResumen .flujo-caja-gastos-grafico-hit {
  cursor: pointer;
}

#panelFlujoCajaResumen .flujo-caja-gastos-grafico-empty {
  width: 100%;
  height: 100%;
  min-height: 150px;
  border-radius: 8px;
  background: linear-gradient(180deg, #f3f4f6 0%, #e5e7eb 100%);
  opacity: 0.45;
}

#panelFlujoCajaResumen .flujo-caja-resumen-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

#panelFlujoCajaResumen .flujo-caja-resumen-kpi {
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 10px;
  background: #fff;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

#panelFlujoCajaResumen .flujo-caja-resumen-kpi-label {
  color: #6b7280;
  font-size: 12px;
  font-weight: 600;
}

#panelFlujoCajaResumen .flujo-caja-resumen-kpi-value {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
}

#panelFlujoCajaResumen .flujo-caja-resumen-kpi-ingreso {
  color: #15803d;
}

#panelFlujoCajaResumen .flujo-caja-resumen-kpi-egreso {
  color: #b91c1c;
}

#panelFlujoCajaResumen .flujo-caja-resumen-kpi-neto {
  color: #1d4ed8;
}

#panelFlujoCajaResumen .flujo-caja-gastos-grafico-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin-bottom: 8px;
}

#panelFlujoCajaResumen .flujo-caja-gastos-grafico-title {
  color: #374151;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
}

#panelFlujoCajaResumen .flujo-caja-resumen-grafico {
  margin: 0 0 16px;
  padding: 12px 14px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 12px;
  background: #f9fafb;
}

#panelFlujoCajaResumen .flujo-caja-resumen-card-principal .flujo-caja-resumen-grafico {
  margin-bottom: 16px;
}

#panelFlujoCajaResumen .flujo-caja-resumen-grafico-leyenda {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 11px;
  color: #6b7280;
}

#panelFlujoCajaResumen .flujo-caja-resumen-leyenda-item::before {
  content: '';
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  margin-right: 6px;
  vertical-align: middle;
}

#panelFlujoCajaResumen .flujo-caja-resumen-leyenda-operativo::before {
  background: #2563eb;
}

#panelFlujoCajaResumen .flujo-caja-resumen-leyenda-real::before {
  background: transparent;
  border: 2px dashed #64748b;
}

.flujo-caja-resumen-grafico-line-operativo {
  stroke: #2563eb;
  vector-effect: non-scaling-stroke;
}

.flujo-caja-resumen-grafico-line-real {
  stroke: #64748b;
  stroke-dasharray: 5 4;
  vector-effect: non-scaling-stroke;
}

.flujo-caja-resumen-table-wrap {
  margin-bottom: 16px;
}

#flujoCajaResumenContenido {
  --flujo-caja-concepto-ancho: 180px;
}

.flujo-caja-resumen-table-wrap.table-responsive,
.flujo-caja-resumen-table-wrap {
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

.flujo-caja-resumen-table {
  width: max-content;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
}

.flujo-caja-resumen-table th,
.flujo-caja-resumen-table td {
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  padding: 8px 10px;
  vertical-align: middle;
  background: #fff;
}

.flujo-caja-resumen-concepto-col {
  width: var(--flujo-caja-concepto-ancho, 180px);
  min-width: var(--flujo-caja-concepto-ancho, 180px);
  max-width: var(--flujo-caja-concepto-ancho, 180px);
  text-align: left;
  position: sticky;
  left: 0;
  z-index: 3;
  background-color: #fff;
  box-shadow: 4px 0 10px -6px rgba(15, 23, 42, 0.18);
  isolation: isolate;
}

.flujo-caja-resumen-table .flujo-caja-resumen-mes-col {
  width: 80px;
  min-width: 80px;
  max-width: 80px;
  box-sizing: border-box;
  white-space: nowrap;
}

.flujo-caja-resumen-table thead th.flujo-caja-resumen-mes-col {
  text-align: right;
}

.flujo-caja-resumen-table thead .flujo-caja-resumen-concepto-col {
  z-index: 5;
  background-color: #fff;
}

.flujo-caja-resumen-seccion-resumen-row .flujo-caja-resumen-concepto-col {
  background: #f9fafb;
}

.flujo-caja-resumen-fila-total .flujo-caja-resumen-concepto-col {
  background: #ecfdf5;
}

.flujo-caja-resumen-fila-saldo .flujo-caja-resumen-concepto-col {
  background: #fffac3;
}

.flujo-caja-resumen-seccion-row th {
  background: #f3f4f6;
  font-weight: 700;
  text-align: left;
  position: sticky;
  left: 0;
  z-index: 4;
  box-shadow: 4px 0 10px -6px rgba(15, 23, 42, 0.12);
}

.flujo-caja-resumen-celda-inactiva {
  color: #9ca3af;
  background: #f9fafb;
}

.flujo-caja-resumen-fila-total {
  background: rgba(34, 197, 94, 0.08);
  font-weight: 700;
}

.flujo-caja-resumen-fila-saldo {
  background: #fffac3;
  font-weight: 700;
}

.flujo-caja-resumen-tabla-card {
  margin-bottom: 0;
}

#flujoCajaResumenEfectivo,
#flujoCajaResumenCuentas {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.flujo-caja-resumen-tabla-header {
  margin-bottom: 8px;
}

.flujo-caja-resumen-tabla-descripcion {
  margin: 4px 0 0;
}

.flujo-caja-resumen-fila-ingreso td {
  background: rgba(34, 197, 94, 0.08);
  font-weight: 600;
}

.flujo-caja-resumen-fila-ingreso .flujo-caja-resumen-concepto-col {
  background-color: #ecfdf5;
  font-weight: 600;
}

.flujo-caja-resumen-fila-egreso td {
  background: rgba(239, 68, 68, 0.08);
  font-weight: 600;
}

.flujo-caja-resumen-fila-egreso .flujo-caja-resumen-concepto-col {
  background-color: #fef2f2;
  font-weight: 600;
}

.flujo-caja-resumen-fila-resultado td,
.flujo-caja-resumen-fila-saldo td {
  background: #ffffff;
  font-weight: 700;
}

.flujo-caja-resumen-fila-resultado .flujo-caja-resumen-concepto-col,
.flujo-caja-resumen-fila-saldo .flujo-caja-resumen-concepto-col {
  background-color: #ffffff;
  font-weight: 700;
}

.flujo-caja-resumen-fila-ingreso.flujo-caja-resumen-nivel-1,
.flujo-caja-resumen-fila-egreso.flujo-caja-resumen-nivel-1 {
  font-weight: 400;
}

.flujo-caja-resumen-fila-ingreso.flujo-caja-resumen-nivel-1 td,
.flujo-caja-resumen-fila-egreso.flujo-caja-resumen-nivel-1 td {
  background: #fff;
  font-weight: 400;
}

.flujo-caja-resumen-fila-ingreso.flujo-caja-resumen-nivel-1 .flujo-caja-resumen-concepto-col,
.flujo-caja-resumen-fila-egreso.flujo-caja-resumen-nivel-1 .flujo-caja-resumen-concepto-col {
  background-color: #fff;
}

.flujo-caja-resumen-table .money-positive {
  color: #15803d;
}

.flujo-caja-resumen-table .money-negative {
  color: #b91c1c;
}

.flujo-caja-resumen-seccion-resumen-row th,
.flujo-caja-resumen-seccion-resumen-row td {
  background: #f9fafb;
  font-weight: 600;
}

.flujo-caja-resumen-bloque-row th {
  background: #e5e7eb;
  border-bottom: 1px solid rgba(15, 23, 42, 0.1);
  color: #374151;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-align: left;
  text-transform: uppercase;
}

.flujo-caja-resumen-fila-linea .flujo-caja-resumen-concepto-col {
  font-weight: 600;
}

.flujo-caja-resumen-fila-linea.flujo-caja-resumen-nivel-1 .flujo-caja-resumen-concepto-col {
  padding-left: 24px;
  font-weight: 500;
}

.flujo-caja-resumen-toggle {
  border: 0;
  background: transparent;
  cursor: pointer;
  padding: 0 4px 0 0;
  color: #374151;
}

.flujo-caja-resumen-nivel-1 .flujo-caja-resumen-concepto-col {
  padding-left: 24px;
}

.flujo-caja-resumen-subtitulo {
  margin: 0 0 10px;
  font-size: 15px;
}

.flujo-caja-resumen-saldos-table {
  width: 100%;
  border-collapse: collapse;
}

.flujo-caja-resumen-saldos-table th,
.flujo-caja-resumen-saldos-table td {
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  padding: 8px 10px;
}

.flujo-caja-resumen-puente-details {
  margin-top: 8px;
}

#flujoCajaConfigDialog .clinical-evaluation-modal.flujo-caja-config-dialog-modal {
  display: flex;
  flex-direction: column;
  width: min(600px, calc(100vw - 32px));
  max-width: 600px;
  min-height: 0;
  max-height: calc(100vh - 32px);
  overflow: hidden;
}

body:not(.is-mobile) #flujoCajaConfigDialog .clinical-evaluation-modal.flujo-caja-config-dialog-modal {
  width: min(600px, calc(100vw - var(--menu-collapsed-width) - 32px));
}

#flujoCajaConfigDialog .flujo-caja-config-dialog-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

#flujoCajaConfigDialogMensaje.dialog-inline-message {
  margin: 0 0 12px;
  display: none;
}

#flujoCajaConfigDialogMensaje.dialog-inline-message.visible {
  display: block;
}

#flujoCajaConfigDialogMensaje.dialog-inline-message.success,
#flujoCajaConfigDialogMensaje.dialog-inline-message.error {
  border-radius: 6px;
}

#flujoCajaConfigDialog .flujo-caja-config-dialog-footer {
  flex-shrink: 0;
  margin: 0;
  padding: 12px 22px max(12px, env(safe-area-inset-bottom, 0px));
  border-top: 1px solid #e5e7eb;
  background: #ffffff;
  box-shadow: 0 -8px 18px rgba(15, 23, 42, 0.08);
  justify-content: flex-end;
}

#flujoCajaConfigDialog .config-panel-description {
  margin-bottom: 22px;
}

#flujoCajaConfigDialog .flujo-caja-config-grid {
  margin-top: 4px;
}

body.is-mobile #flujoCajaConfigDialog .clinical-evaluation-modal.flujo-caja-config-dialog-modal {
  max-height: min(100dvh, calc(100vh - 16px));
}

body.is-mobile #flujoCajaConfigDialog .flujo-caja-config-dialog-body {
  padding-bottom: 8px;
}

body.is-mobile #flujoCajaConfigDialog .flujo-caja-config-dialog-footer {
  padding-left: 16px;
  padding-right: 16px;
}

.flujo-caja-config-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 12px;
}

body.is-mobile .flujo-caja-config-grid {
  grid-template-columns: 1fr;
}

.flujo-caja-config-saldos {
  display: grid;
  gap: 10px;
}

#panelFlujoCajaResumen .flujo-caja-resumen-placeholder-actions {
  margin: 0;
  justify-content: center;
}

body.is-mobile #panelFlujoCajaResumen .flujo-caja-resumen-kpis {
  grid-template-columns: 1fr;
}

.col-w-82 {
  width: 82px;
  min-width: 82px;
  max-width: 82px;
  white-space: nowrap;
}

.col-w-60 {
  width: 60px;
  min-width: 60px;
  max-width: 60px;
  white-space: nowrap;
}

.col-w-150 {
  width: 150px;
  min-width: 150px;
  max-width: 150px;
  white-space: nowrap;
}

.col-w-90 {
  width: 90px;
  min-width: 90px;
  max-width: 90px;
}

.col-w-120 {
  width: 120px;
  min-width: 120px;
  max-width: 120px;
  white-space: nowrap;
}

#vistaClientes .table-responsive.table-desktop th.col-clientes-col-90,
#vistaClientes .table-responsive.table-desktop td.col-clientes-col-90 {
  width: 90px;
  min-width: 90px;
  max-width: 90px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#vistaClientes .table-responsive.table-desktop th.col-clientes-correo,
#vistaClientes .table-responsive.table-desktop td.col-clientes-correo {
  min-width: 180px;
  word-break: break-word;
}

#vistaClientes .table-responsive.table-desktop th.col-clientes-nombre-completo,
#vistaClientes .table-responsive.table-desktop td.col-clientes-nombre-completo {
  min-width: 150px;
  word-break: break-word;
}

.col-min-130 {
  min-width: 130px;
  width: auto;
  max-width: none;
  word-break: break-word;
}

th.money-col.col-w-90,
td.money-col.col-w-90 {
  min-width: 90px;
  max-width: 90px;
  width: 90px;
  white-space: nowrap;
}

th.money-col.col-w-120,
td.money-col.col-w-120 {
  min-width: 120px;
  max-width: 120px;
  width: 120px;
  white-space: nowrap;
}

.table-responsive.table-desktop table {
  table-layout: fixed;
  width: 100%;
}

/* Altura por fila según contenido (evita techo en columna acciones cuando otras celdas multi-línea). */
.table-responsive.table-desktop thead th,
.table-responsive.table-desktop tbody td {
  height: auto;
  min-height: 34px;
}

.table-responsive.table-desktop.skeleton-table thead th,
.table-responsive.table-desktop.skeleton-table tbody tr,
.table-responsive.table-desktop.skeleton-table tbody td {
  box-sizing: border-box;
  height: 37px;
  min-height: 37px;
  max-height: 37px;
  padding: 4px 8px;
  vertical-align: middle;
}

.table-responsive.table-desktop.skeleton-table thead th {
  overflow: hidden;
}

.table-responsive.table-desktop.skeleton-table tbody td .skeleton-line {
  height: 14px;
}

/* El contenido no invade celdas vecinas (p. ej. correos largos). */
.table-responsive.table-desktop tbody td {
  box-sizing: border-box;
  vertical-align: middle;
  overflow: hidden;
}

.table-responsive.table-desktop tbody td.table-actions-col {
  overflow: visible;
  vertical-align: middle;
}

#resultadoRecordatorios .table-responsive.table-desktop tbody td.recordatorios-col-estado {
  overflow: visible;
}

.table-responsive.table-desktop tbody td:not(.table-actions-col):not(.money-col):not(.col-w-60):not(.col-w-82):not(.col-w-90):not(.col-w-120):not(.col-w-150):not(.services-col-price):not(.services-col-gastos):not(.services-col-estado):not(.recordatorios-col-recordatorio):not(.recordatorios-col-estado):not(.config-rec-cliente-col-estado) {
  overflow-wrap: anywhere;
  word-wrap: break-word;
  word-break: normal;
}

.table-responsive.table-desktop tbody td.money-col,
.table-responsive.table-desktop tbody td.col-w-60,
.table-responsive.table-desktop tbody td.col-w-82,
.table-responsive.table-desktop tbody td.col-w-90,
.table-responsive.table-desktop tbody td.col-w-120,
.table-responsive.table-desktop tbody td.col-w-150,
.table-responsive.table-desktop tbody td.services-col-price,
.table-responsive.table-desktop tbody td.services-col-gastos,
.table-responsive.table-desktop tbody td.recordatorios-col-recordatorio,
.table-responsive.table-desktop tbody td.recordatorios-col-estado {
  text-overflow: ellipsis;
}

/* Columnas con status-pill: sin ellipsis de celda (evita puntos sueltos a la derecha del pill). */
.table-responsive.table-desktop tbody td.col-estado-presupuesto,
.table-responsive.table-desktop tbody td.col-estado-cita,
.table-responsive.table-desktop tbody td.services-col-estado,
.table-responsive.table-desktop tbody td.config-rec-cliente-col-estado,
.table-responsive.table-desktop tbody td.transaccion-neto-col:has(.status-pill) {
  overflow: visible;
  text-overflow: unset;
}

.services-col-price,
.services-col-gastos,
.services-col-estado {
  white-space: nowrap;
}

.services-col-price {
  width: 90px;
  min-width: 90px;
  max-width: 90px;
}

.services-col-gastos {
  width: 90px;
  min-width: 90px;
  max-width: 90px;
}

.services-col-estado {
  width: 90px;
  min-width: 90px;
  max-width: 90px;
}

.recordatorios-col-recordatorio {
  width: 150px;
  min-width: 150px;
  max-width: 150px;
  white-space: nowrap;
}

.recordatorios-col-estado {
  width: 120px;
  min-width: 120px;
  max-width: 120px;
  white-space: nowrap;
}

/* Recordatorios: 3 slots, mínimo 96px (equivalente 3 botones) */
th.recordatorios-table-actions-col.table-actions-col,
td.table-actions.recordatorios-table-actions-col.table-actions-col {
  width: 96px;
  min-width: 96px;
  max-width: 96px;
  box-sizing: border-box;
}

#configRecordatoriosClientesContainer .table-responsive.table-desktop {
  max-width: 100%;
  min-width: 0;
}

#configRecordatoriosClientesContainer th.config-rec-cliente-col-estado,
#configRecordatoriosClientesContainer td.config-rec-cliente-col-estado {
  box-sizing: border-box;
  max-width: 100px;
  min-width: 100px;
  overflow: visible;
  white-space: nowrap;
  width: 100px;
}

#configRecordatoriosClientesContainer th.table-actions-col,
#configRecordatoriosClientesContainer td.table-actions.table-actions-col {
  box-sizing: border-box;
  max-width: 120px;
  min-width: 120px;
  width: 120px;
}

#reglaRecordatorioClienteDialog .field label {
  font-size: 14px;
}

#reglaRecClienteMensajes .field + .field {
  margin-top: 14px;
}

.regla-rec-cliente-media-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.regla-rec-cliente-header-col,
.regla-rec-cliente-botones-col {
  margin: 0;
}

.regla-rec-cliente-botones-grid {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.regla-rec-cliente-boton-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(140px, 180px);
  gap: 12px;
  align-items: center;
}

.regla-rec-cliente-boton-text {
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.35;
}

.regla-rec-cliente-boton-accion-field {
  margin: 0;
}

@media (max-width: 720px) {
  .regla-rec-cliente-media-row {
    grid-template-columns: 1fr;
  }

  .regla-rec-cliente-boton-row {
    grid-template-columns: 1fr;
  }
}

.status-pill-cita-programada {
  background: #fef9c3;
  color: #a16207;
}

.status-pill-cita-confirmada {
  background: #dcfce7;
  color: #166534;
}

.status-pill-cita-cancelada {
  background: #fee2e2;
  color: #991b1b;
}

.status-pill-cita-atendida {
  background: #dbeafe;
  color: #1e40af;
}

.cita-detalle-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cita-detalle-estado-campo {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.cita-detalle-estado-trigger {
  appearance: none;
  border: none;
  margin: 0;
  font: inherit;
  cursor: pointer;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding-right: 28px;
  min-height: 28px;
}

.cita-detalle-estado-trigger:focus-visible {
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}

.cita-detalle-estado-trigger-label {
  line-height: 1.2;
}

.cita-detalle-estado-trigger-chevron {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #111827;
  font-size: 12px;
  line-height: 1;
  pointer-events: none;
}

.cita-estado-picker-backdrop {
  z-index: 10025;
}

.cita-estado-picker-opciones {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cita-estado-picker-pill {
  appearance: none;
  border: 2px solid transparent;
  margin: 0;
  width: 100%;
  box-sizing: border-box;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  padding: 12px 16px;
  cursor: pointer;
  text-align: center;
}

.cita-estado-picker-pill.status-pill-cita-programada {
  border-color: #eab308;
}

.cita-estado-picker-pill.status-pill-cita-confirmada {
  border-color: #22c55e;
}

.cita-estado-picker-pill.status-pill-cita-atendida {
  border-color: #3b82f6;
}

.cita-estado-picker-pill.status-pill-cita-cancelada {
  border-color: #f87171;
}

.cita-estado-picker-pill.is-selected {
  opacity: 0.22;
  cursor: default;
  box-shadow: none;
}

.cita-estado-picker-pill.is-disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.cita-estado-picker-pill.is-selected.is-disabled {
  opacity: 0.22;
}

td.services-col-price,
td.services-col-gastos {
  text-align: right;
}

.money-col {
  min-width: 112px;
  white-space: nowrap;
}

td.money-col {
  text-align: right;
}

td.transaccion-neto-col {
  text-align: center;
}

thead th.money-col,
thead th.services-col-price,
thead th.services-col-gastos {
  text-align: left;
}

thead th.table-sortable.money-col .table-sortable-inner,
thead th.table-sortable.services-col-price .table-sortable-inner,
thead th.table-sortable.services-col-gastos .table-sortable-inner {
  justify-content: space-between;
}

.detail-tabs {
  display: flex;
  gap: 8px;
  border-bottom: 1px solid #e5e7eb;
  margin-bottom: 18px;
}

.detail-tab {
  border: none;
  border-bottom: 3px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #4b5563;
  padding: 10px 12px;
  font-weight: 600;
  cursor: pointer;
}

.detail-tab.active {
  border-bottom-color: #2563eb;
  color: #1d4ed8;
  background: #eff6ff;
}

#tabsDetalleVentaScroll {
  min-width: 0;
  flex-shrink: 0;
  box-sizing: border-box;
  padding: 12px 10px 0;
  overflow: visible;
}

#vistaVentaFormulario .venta-registro-panels {
  display: flex;
  flex-direction: column;
  gap: 0;
}

#vistaVentaFormulario #panelDetalleVenta.detail-tab-panel.active {
  gap: 0;
}

#tabsDetalleVenta .detail-tab {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 14px 10px 12px;
  overflow: visible;
}

#tabsDetalleVenta .detail-tab-count-badge {
  position: absolute;
  top: -2px;
  right: -2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  box-sizing: border-box;
}

#tabsDetalleVenta .detail-tab-count-badge--loading,
#tabsDetalleCliente .detail-tab-count-badge--loading {
  font-size: 0;
  min-width: 16px;
  padding: 0;
}

#tabsDetalleVenta .detail-tab-count-badge--loading::after,
#tabsDetalleCliente .detail-tab-count-badge--loading::after {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  animation: detail-tab-count-badge-pulse 1s ease-in-out infinite;
}

@keyframes detail-tab-count-badge-pulse {
  0%,
  100% {
    opacity: 0.35;
    transform: scale(0.82);
  }

  50% {
    opacity: 1;
    transform: scale(1);
  }
}

@media (max-width: 900px) {
  #tabsDetalleVentaScroll {
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    border-bottom: 1px solid #e5e7eb;
    margin-bottom: 18px;
    padding: 12px 10px 4px;
  }

  #tabsDetalleVenta.detail-tabs {
    flex-wrap: nowrap;
    min-width: min-content;
    border-bottom: none;
    margin-bottom: 0;
  }

  #tabsDetalleVenta .detail-tab {
    flex: 0 0 auto;
  }
}

.detail-tabs-scroll {
  padding: 4px 4px 10px;
  box-sizing: border-box;
}

#tabsDetalleClienteScroll {
  min-width: 0;
  width: 100%;
  flex-shrink: 0;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

#tabsDetalleCliente.detail-tabs {
  box-sizing: border-box;
  width: max-content;
  min-width: 100%;
  flex-wrap: nowrap;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  padding: 14px;
  margin-bottom: 0;
  overflow: visible;
}

#tabsDetalleCliente .detail-tab {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  padding: 12px 14px 10px 12px;
  overflow: visible;
}

#tabsDetalleCliente .detail-tab-count-badge {
  position: absolute;
  top: -2px;
  right: -2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  box-sizing: border-box;
}

#tabsDetalleCliente .detail-tab-br {
  display: none;
}

@media (max-width: 640px) {
  #tabsDetalleCliente .detail-tab-br {
    display: inline;
  }

  #tabsDetalleCliente .detail-tab {
    text-align: center;
    white-space: normal;
    line-height: 1.2;
  }

  #tabsDetalleCliente .detail-tab-label {
    display: inline-block;
    text-align: center;
    line-height: 1.2;
  }
}


.detail-tab-panel {
  display: none;
}

.detail-tab-panel.active {
  display: flex;
  flex-direction: column;
  flex: 1 1 0%;
  min-height: 0;
  gap: 0px;
  margin-bottom: 30px;
}

#vistaRegistro .cliente-registro-body {
  flex: 1 1 0%;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

#vistaRegistro .cliente-registro-panels {
  flex: 1 1 0%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 20px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  margin-top:18px;
}

#vistaFlujoCaja .flujo-caja-body {
  flex: 1 1 0%;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

#tabsFlujoCajaScroll {
  min-width: 0;
  width: 100%;
  flex-shrink: 0;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

#tabsFlujoCaja.detail-tabs {
  box-sizing: border-box;
  width: max-content;
  min-width: 100%;
  flex-wrap: nowrap;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  padding: 14px;
  margin-bottom: 0;
  overflow: visible;
}

#tabsFlujoCaja .detail-tab {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  padding: 12px 14px 10px 12px;
  overflow: visible;
}

#vistaFlujoCaja .flujo-caja-cabecera {
  flex-shrink: 0;
  font-size: 18px;
  font-weight: 600;
  color: #111827;
  padding: 4px 0 10px;
  margin: 0;
  line-height: 1.35;
}

#vistaFlujoCaja .flujo-caja-panels {
  flex: 1 1 0%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 20px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  margin-top: 18px;
}

#vistaFlujoCaja .flujo-caja-cabecera,
#vistaFlujoCaja .flujo-caja-body #tabsFlujoCajaScroll,
#vistaFlujoCaja .flujo-caja-body #tabsFlujoCaja {
  flex-shrink: 0;
}

#vistaFlujoCaja #panelFlujoCajaGastos.active #resultadoGastosFlujoCaja {
  flex: 1 1 0%;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
  padding: 6px 8px 16px;
}

#tabsFlujoCaja .detail-tab-br {
  display: none;
}

@media (max-width: 640px) {
  #tabsFlujoCaja .detail-tab-br {
    display: inline;
  }

  #tabsFlujoCaja .detail-tab {
    text-align: center;
    white-space: normal;
    line-height: 1.2;
  }

  #tabsFlujoCaja .detail-tab-label {
    display: inline-block;
    text-align: center;
    line-height: 1.2;
  }
}

#vistaRegistro .cliente-detalle-nombre-cabecera {
  flex-shrink: 0;
  font-size: 18px;
  font-weight: 600;
  color: #111827;
  padding: 4px 0 10px;
  margin: 0;
  line-height: 1.35;
}

#vistaRegistro .cliente-gestion-estado-detalle {
  margin-top: 28px;
  width: 100%;
  max-width: none;
}

body:not(.is-mobile) #vistaRegistro .cliente-gestion-estado-detalle {
  margin-top: 28px;
}

#vistaRegistro .cliente-datos-acciones-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
}

body:not(.is-mobile) #vistaRegistro #accionesDatosCliente,
body:not(.is-mobile) #vistaRegistro #panelHistorialVentasCliente .cliente-detalle-footer-mobile,
body:not(.is-mobile) #vistaRegistro #panelHistorialPagosCliente .cliente-detalle-footer-mobile,
body:not(.is-mobile) #vistaRegistro #panelHistorialCitasCliente .cliente-detalle-footer-mobile {
  display: none !important;
}

body.is-mobile #vistaRegistro .cliente-datos-acciones-inline {
  display: none !important;
}

#vistaRegistro .cliente-gestion-estado-card {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  padding: 16px 18px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px 24px;
  align-items: center;
}

#vistaRegistro .cliente-gestion-estado-textos p {
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.5;
  color: #475569;
}

#vistaRegistro .cliente-gestion-estado-textos p:last-child {
  margin-bottom: 0;
}

#vistaRegistro .cliente-gestion-estado-accion {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
}

#vistaRegistro .cliente-gestion-estado-accion button {
  padding: 12px 20px;
  border: none;
  border-radius: 6px;
  color: #fff;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}

#vistaRegistro .cliente-gestion-estado-accion button.danger {
  background: #dc2626;
}

#vistaRegistro .cliente-gestion-estado-accion button.danger:hover {
  background: #b91c1c;
}

#vistaRegistro .cliente-gestion-estado-accion button.success {
  background: #16a34a;
}

#vistaRegistro .cliente-gestion-estado-accion button.success:hover {
  background: #15803d;
}

@media (max-width: 640px) {
  #panelDatosCliente .form-grid > .field,
  #panelDatosCliente [data-registro-campo-adicional] {
    grid-column: 1 / -1;
  }

  #vistaRegistro .cliente-gestion-estado-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  #vistaRegistro .cliente-gestion-estado-accion {
    justify-content: stretch;
  }

  #vistaRegistro .cliente-gestion-estado-accion button {
    width: 100%;
  }
}

#vistaRegistro .cliente-registro-body > h1,
#vistaRegistro .cliente-detalle-nombre-cabecera,
#vistaRegistro .cliente-registro-body #tabsDetalleClienteScroll,
#vistaRegistro .cliente-registro-body #tabsDetalleCliente {
  flex-shrink: 0;
}

#vistaRegistro .detail-tab-panel.active .form-actions-sticky {
  flex-shrink: 0;
}

#vistaRegistro #resultadoHistorialVentasCliente,
#vistaRegistro #resultadoHistorialPresupuestosCliente,
#vistaRegistro #resultadoHistorialPagosCliente,
#vistaRegistro #resultadoHistorialCitasCliente {
  flex: 1 1 0%;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
  padding: 6px 8px 16px;
}

#vistaRegistro .detail-tab-panel.active .toolbar-search {
  flex-shrink: 0;
}

#vistaRegistro #panelHistoriaClinicaCliente.active #resultadoHistoriaClinicaCliente {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}

#resultadoHistoriaClinicaCliente {
  padding-bottom: 20px;
}

.clinical-history-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.clinical-history-code-row {
  display: none;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 14px;
}

.clinical-history-code-row .clinical-history-code {
  margin: 0;
}

.clinical-history-code-row .clinical-history-meta {
  margin: 0;
}

.clinical-section-head-check {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  cursor: pointer;
}

.clinical-section-head-check input[type="checkbox"] {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  cursor: pointer;
}

.clinical-section-head-label {
  font-size: 15px;
  font-weight: 600;
  color: #111827;
  margin: 0;
  cursor: pointer;
}

.clinical-collapsible-section .clinical-section-body {
  padding-top: 4px;
}

textarea.clinical-anotaciones-libres {
  width: 100%;
  box-sizing: border-box;
}

#budgetConfigDialog .dialog > h3 {
  margin-bottom: 20px;
}

/* Líneas de detalle presupuesto/venta: ≥900px tabla, 641–899px card tablet, ≤640px card móvil */

.presupuesto-card-nombre-wrap,
.servicio-card-nombre-wrap {
  pointer-events: none;
}

.cliente-card-nombre-hit.presupuesto-card-titulo-hit,
.servicio-card-nombre-hit {
  pointer-events: auto;
  display: inline-block;
  width: auto;
  max-width: 100%;
  vertical-align: top;
  font: inherit;
  text-align: inherit;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: inherit;
  cursor: pointer;
}

.clinical-history-code {
  font-size: 18px;
  font-weight: 700;
  color: #111827;
  margin: 0 0 4px;
}

.clinical-history-meta {
  color: #6b7280;
  font-size: 13px;
}

.clinical-empty-evaluations {
  margin-bottom: 16px;
}

.clinical-timeline {
  position: relative;
  display: grid;
  gap: 16px;
  margin-top: 18px;
  padding-top: 18px;
  padding-bottom: 18px;
  padding-left: 118px;
}

.clinical-timeline::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 90px;
  width: 3px;
  border-radius: 999px;
  background: #dbeafe;
}

.clinical-timeline-end-label {
  position: absolute;
  left: 90px;
  z-index: 1;
  color: #6b7280;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.02em;
  white-space: nowrap;
  transform: translateX(-50%);
  pointer-events: none;
  user-select: none;
}

.clinical-timeline-end-label--top {
  top: -10px;
  transform: translateX(-50%) translateY(-50%);
}

.clinical-timeline-end-label--bottom {
  bottom: -10px;
  transform: translateX(-50%) translateY(50%);
}

.clinical-timeline-item {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
}

.clinical-timeline-date {
  position: absolute;
  top: 14px;
  left: -118px;
  width: 74px;
  text-align: right;
  color: #374151;
  font-size: 12px;
  font-weight: 700;
}

.clinical-timeline-dot {
  position: absolute;
  top: 17px;
  left: -35px;
  width: 10px;
  height: 10px;
  border: 3px solid #2563eb;
  border-radius: 999px;
  background: #2563eb;
}

.clinical-evaluation-card,
.clinical-form-card,
.odontogram-panel {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #ffffff;
  padding: 16px;
}

.clinical-evaluation-card {
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.clinical-evaluation-card--no-detail {
  cursor: default;
}

.clinical-section-title {
  margin: 0 0 12px;
  color: #111827;
  font-size: 16px;
  font-weight: 700;
}

.clinical-evaluation-summary {
  appearance: none;
  border: none;
  background: transparent;
  color: inherit;
  cursor: inherit;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 5px;
  padding: 0;
  text-align: left;
  width: 100%;
}

.clinical-evaluation-summary-text {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.clinical-evaluation-anotaciones-preview {
  font-size: 13px;
  color: #6b7280;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
  margin-left: 20px;
}

.clinical-evaluation-seccion-preview {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 13px;
  color: #6b7280;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
  margin-left: 0px;
}

.clinical-evaluation-seccion-check {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  margin-top: 1px;
  border-radius: 50%;
  background: #ecfdf5;
  color: #059669;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.clinical-evaluation-seccion-check svg {
  display: block;
  width: 12px;
  height: 12px;
  fill: currentColor;
}

.clinical-evaluation-seccion-text {
  flex: 1 1 auto;
  min-width: 0;
}

.clinical-evaluation-seccion-text strong {
  font-weight: 700;
  color: #4b5563;
}

.clinical-evaluation-title {
  font-weight: 700;
  color: #111827;
}

.clinical-evaluation-attended-by {
  color: #4b5563;
  font-size: 13px;
  margin-top: 3px;
  margin-left: 20px;
}

.clinical-evaluation-date {
  color: #6b7280;
  font-size: 13px;
  margin-top: 4px;
}

.clinical-evaluation-toggle {
  color: #2563eb;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

.clinical-evaluation-detail {
  border-top: 1px solid #e5e7eb;
  margin-top: 14px;
  padding-top: 14px;
}

.clinical-evaluation-detail .clinical-section-title {
  margin-top: 40px;
}

.clinical-evaluation-detail .clinical-section-title:first-child {
  margin-top: 0;
}

.clinical-evaluation-detail.is-collapsed {
  display: none;
}

.clinical-odontogram-detail {
  margin: 12px 0;
}

.clinical-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px 14px;
  margin-bottom: 14px;
}

.clinical-summary-item {
  color: #374151;
  font-size: 13px;
}

.clinical-summary-item strong {
  color: #111827;
}

.clinical-conditional-field.is-hidden {
  display: none;
}

.clinical-fields {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px 18px;
  align-items: start;
}

.clinical-field-row {
  display: grid;
  grid-template-columns: minmax(150px, 23%) minmax(0, 27%) minmax(90px, 15%) minmax(0, 35%);
  gap: 12px;
  align-items: center;
  width: 100%;
  min-width: 0;
}

.clinical-field-row.has-extra,
.clinical-field-row.full {
  grid-column: 1 / -1;
  width: 100%;
}

.clinical-field-row.has-extra {
  grid-template-columns: minmax(150px, 23%) minmax(0, 27%) minmax(90px, 15%) minmax(0, 35%);
}

.clinical-field-label {
  color: #374151;
  font-size: 12px;
  font-weight: 600;
}

.clinical-field-control {
  min-width: 0;
}

.clinical-field-row:not(.has-extra):not(.full) .clinical-field-control {
  grid-column: 2;
}

.clinical-field-control .combo-select,
.clinical-field-control input,
.clinical-field-control select,
.clinical-field-control textarea {
  width: 100%;
}

.clinical-field-control textarea {
  min-height: 48px;
}

.clinical-field-row.full {
  grid-template-columns: minmax(150px, 23%) minmax(0, 27%) minmax(90px, 15%) minmax(0, 35%);
}

.clinical-field-row.full .clinical-field-control {
  grid-column: 2;
}

.clinical-form-card .form-section {
  margin-top: 18px;
}

.clinical-form-card .form-actions-sticky {
  position: static;
  margin: 20px 0 0;
  padding: 14px 0 0;
  border-top: 1px solid #e5e7eb;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.clinical-visit-form-actions--edit > button.secondary {
  margin-left: auto;
}


@media (max-width: 900px) {
  #vistaConfiguracion .config-inner-tabs {
    max-width: 100%;
  }
}

.config-layout {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  min-width: 0;
}

.config-content {
  min-width: 0;
}

.config-menu {
  display: grid;
  gap: 8px;
  position: sticky;
  top: 0;
}

.config-menu-button {
  width: 100%;
  min-height: 38px;
  padding: 10px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #ffffff;
  color: #374151;
  cursor: pointer;
  font-weight: 500;
  text-align: left;
}

.config-menu-button:hover,
.config-menu-button.active {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}

.config-panel {
  display: none;
}

.config-panel.active {
  display: block;
}

.config-panel h2 {
  margin: 0 0 8px;
  font-size: 18px;
}

.config-panel-description {
  margin: 0 0 16px;
  color: #6b7280;
  font-size: 13px;
  line-height: 1.45;
}

#vistaConfiguracion .config-inner-tabs {
  margin: 4px 0 16px;
  flex-wrap: nowrap;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

#vistaConfiguracion .config-inner-tabs .detail-tab {
  flex: 0 0 auto;
  white-space: nowrap;
}

#configPanelDatosNegocio .config-panel-description {
  margin-bottom: 22px;
}

.config-empresa-form > .form-grid:first-of-type {
  margin-bottom: 6px;
}

.config-empresa-form .form-section {
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid #e8ecef;
}

.config-empresa-form .form-section h2 {
  margin: 0 0 12px;
  font-size: 17px;
}

.config-empresa-form .form-section .form-grid {
  margin-top: 0;
}

.config-edit-table {
  display: grid;
  gap: 8px;
}

.config-edit-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 190px 34px;
  gap: 10px;
  align-items: center;
  padding: 0;
}

.config-edit-row.account-row {
  grid-template-columns: minmax(0, 1fr) minmax(180px, 260px) 34px;
}

#configComprobantesPagoContainer .config-edit-row {
  grid-template-columns: minmax(0, 1fr) 34px;
}

.config-cuentas-bancarias-cards {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
  max-width: 100%;
}

.config-cuenta-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #ffffff;
  box-sizing: border-box;
  min-width: 0;
}

.config-cuenta-card-row-top {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.9fr) minmax(160px, 0.85fr) 34px;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.config-cuenta-card-row-top .field {
  min-width: 0;
  margin: 0;
}

.config-cuenta-card-row-top .config-edit-actions {
  flex-shrink: 0;
  justify-content: flex-end;
}

.config-cuenta-card-row-bottom {
  width: 100%;
  min-width: 0;
}

.config-cuenta-card-row-bottom .field {
  margin: 0;
  min-width: 0;
}

.config-cuenta-card-row-top .field > label,
.config-cuenta-modalidades-label {
  display: block;
  text-align: left;
  margin: 0 0 4px;
  font-size: 10px;
  line-height: 1.3;
  font-weight: 600;
  color: #6b7280;
}

.eecc-cuentas-grid {
  display: grid;
  gap: 14px;
}

.eecc-cuenta-card {
  display: grid;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #ffffff;
  box-sizing: border-box;
  min-width: 0;
}

.eecc-cuenta-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.eecc-upload-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  gap: 12px;
  align-items: end;
}

.eecc-upload-row .field {
  margin: 0;
}

.eecc-upload-actions {
  margin: 0;
}

.eecc-upload-card {
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  width: 100%;
  box-sizing: border-box;
}

.eecc-upload-card .config-logo-dropzone {
  min-height: 170px;
}

.eecc-file-preview {
  height: 74px;
}

.eecc-file-preview.has-file {
  color: #166534;
  background: #c4f7d6;
}

.eecc-upload-help {
  color: #64748b;
  font-size: 13px;
  line-height: 1.45;
}

.eecc-upload-help p {
  margin: 0;
}

.eecc-result-summary {
  display: grid;
  gap: 12px;
  margin-bottom: 14px;
}

.eecc-result-section {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #ffffff;
}

.eecc-result-section h4 {
  margin: 0;
  color: #111827;
  font-size: 14px;
}

.eecc-validation-summary {
  /* Card neutro: hereda estilos de .eecc-result-section */
}

.eecc-validation-table-wrap {
  display: flex;
  justify-content: center;
  overflow-x: auto;
  max-width: 100%;
  margin-bottom: 20px;
}

.eecc-validation-table {
  width: max-content;
  max-width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.eecc-validation-table th,
.eecc-validation-table td {
  padding: 8px 12px;
  border: 1px solid #e5e7eb;
  white-space: nowrap;
}

.eecc-validation-table thead th {
  background: #f8fafc;
  color: #111827;
  font-weight: 600;
  text-align: left;
}

.eecc-validation-table thead th.money-col {
  text-align: right;
}

.eecc-validation-row--neutral td {
  background: #ffffff;
}

.eecc-validation-row--ok td {
  background: #dcfce7;
  color: #166534;
}

.eecc-validation-row--error td {
  background: #fee2e2;
  color: #991b1b;
}

.eecc-validation-block {
  display: grid;
  gap: 8px;
}

.eecc-validation-block + .eecc-validation-block {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(17, 24, 39, 0.08);
}

.eecc-validation-block-title {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
}

.eecc-resultado-dialog-actions .eecc-resultado-btn-hidden {
  display: none;
}

#eeccScanProgressDialog .eecc-scan-progress-modal {
  max-width: 460px;
}

.eecc-scan-progress-body {
  display: grid;
  gap: 14px;
}

.eecc-scan-progress-file {
  margin: 0;
  font-size: 13px;
  color: #4b5563;
  word-break: break-word;
}

.eecc-scan-progress-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.eecc-scan-progress-step {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: #9ca3af;
}

.eecc-scan-progress-step.is-active {
  color: #111827;
  font-weight: 600;
}

.eecc-scan-progress-step.is-done {
  color: #166534;
}

.eecc-scan-progress-step.is-failed {
  color: #b91c1c;
}

.eecc-scan-progress-step[hidden] {
  display: none;
}

.eecc-scan-progress-step-icon {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 2px solid currentColor;
  box-sizing: border-box;
  position: relative;
}

.eecc-scan-progress-step.is-active .eecc-scan-progress-step-icon {
  border-color: #2563eb;
  border-top-color: transparent;
  animation: girar 0.8s linear infinite;
}

.eecc-scan-progress-step.is-done .eecc-scan-progress-step-icon {
  border-color: #16a34a;
  background: #16a34a;
}

.eecc-scan-progress-step.is-done .eecc-scan-progress-step-icon::after {
  content: '';
  position: absolute;
  left: 4px;
  top: 1px;
  width: 4px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.eecc-scan-progress-step.is-failed .eecc-scan-progress-step-icon {
  border-color: #dc2626;
  background: #dc2626;
  animation: none;
}

.eecc-scan-progress-step.is-failed .eecc-scan-progress-step-icon::after {
  content: '×';
  position: absolute;
  left: 50%;
  top: 50%;
  width: auto;
  height: auto;
  border: none;
  transform: translate(-50%, -58%);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
}

.eecc-scan-progress-step.is-pending .eecc-scan-progress-step-icon {
  border-color: #d1d5db;
  background: #f9fafb;
}

.eecc-scan-progress-step-meta {
  font-size: 12px;
  font-weight: 600;
  color: #2563eb;
}

.eecc-scan-progress-bar-wrap[hidden] {
  display: none;
}

.eecc-scan-progress-bar-track {
  width: 100%;
  height: 8px;
  border-radius: 999px;
  background: #e5e7eb;
  overflow: hidden;
}

.eecc-scan-progress-bar {
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2563eb, #3b82f6);
  transition: width 0.2s ease;
}

.eecc-scan-progress-elapsed {
  margin: 0;
  font-size: 13px;
  color: #6b7280;
}

.eecc-scan-progress-hint {
  margin: 0;
}

.eecc-scan-progress-footer {
  justify-content: center;
  margin-bottom: 20px;
}

.eecc-tx-editing .eecc-tx-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  padding: 6px 8px;
  font-size: 13px;
  background: #fff;
  color: #111827;
}

.eecc-tx-editing .eecc-tx-input-money {
  text-align: right;
}

.eecc-tx-actions-col {
  white-space: nowrap;
}

.eecc-detected-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px;
}

.eecc-expected-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px;
}

.eecc-expected-item {
  display: grid;
  gap: 4px;
  padding: 9px 10px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #ffffff;
  color: #374151;
  font-size: 13px;
}

.eecc-expected-item strong {
  color: #111827;
}

.eecc-detected-item {
  display: grid;
  gap: 4px;
  padding: 9px 10px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #ffffff;
  color: #374151;
  font-size: 13px;
}

.eecc-detected-item strong {
  color: #111827;
}

.eecc-detected-item.matched {
  border-color: #86efac;
  background: #c4f7d6;
  color: #166534;
}

.eecc-detected-item.matched strong {
  color: #14532d;
}

.eecc-detected-item.mismatch {
  border-color: #fecaca;
  background: #fee2e2;
  color: #991b1b;
}

.eecc-detected-item.mismatch strong {
  color: #7f1d1d;
}

.eecc-total-row td {
  border-top: 2px solid #e5e7eb;
  background: #f8fafc;
}

.eecc-balance-row td {
  border-top: 1px solid #e5e7eb;
  background: #ffffff;
}

.eecc-warning-list {
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border: 1px solid #fbbf24;
  border-radius: 10px;
  background: #fffbeb;
  color: #92400e;
  font-size: 13px;
}

.eecc-warning-list p {
  margin: 0;
}

.eecc-strategy-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  align-items: center;
  color: #475569;
  font-size: 12px;
}

.eecc-strategy-list span {
  padding: 4px 8px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
}

.eecc-template-candidate {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  background: #eff6ff;
  color: #1e3a8a;
  font-size: 13px;
}

.eecc-template-candidate small {
  color: #1d4ed8;
}

.config-edit-header {
  padding: 0 10px;
  border: none;
  background: transparent;
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
}

/* Configuracion › Recordatorios: destinatarios adicionales (alineado a 12px del resto del formulario) */
#tablaConfigRecordatoriosDestinatarios {
  table-layout: fixed;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

#tablaConfigRecordatoriosDestinatarios thead th:first-child,
#tablaConfigRecordatoriosDestinatarios tbody td:first-child {
  min-width: 0;
}

#tablaConfigRecordatoriosDestinatarios thead th:first-child .table-sortable-inner {
  min-width: 0;
}

#tablaConfigRecordatoriosDestinatarios thead th:first-child .table-sortable-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#tablaConfigRecordatoriosDestinatarios .config-rd-row-principal td:first-child {
  overflow-wrap: anywhere;
  word-break: break-word;
}

#tablaConfigRecordatoriosDestinatarios .config-rd-email-input {
  font-size: 12px;
  line-height: 1.35;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

#configRecordatoriosDestinatariosContainer {
  margin-bottom: 30px;
}

#configRecordatoriosDestinatariosContainer .clientes-cards .config-rd-email-input {
  font-size: 12px;
  line-height: 1.35;
}

#configRecordatoriosDestinatariosContainer .cliente-card-acciones-checkbox label {
  display: flex;
  align-items: center;
  gap: 8px;
}

#configRecordatoriosDestinatariosContainer .cliente-card-acciones-checkbox input[type="checkbox"] {
  width: auto;
  max-width: none;
  min-width: 0;
  flex-shrink: 0;
  margin: 0;
}

#configRecordatoriosDestinatariosContainer .cliente-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding-right: 0;
}

#configRecordatoriosDestinatariosContainer .cliente-card-header .cliente-card-nombre {
  flex: 1;
  min-width: 0;
}

#configRecordatoriosDestinatariosContainer .table-responsive.table-desktop {
  min-width: 0;
  max-width: 100%;
}

#tablaConfigRecordatoriosDestinatarios tr.config-rd-fila-filtro-oculto,
#configRecordatoriosDestinatariosContainer .clientes-cards article.cliente-card.config-rd-fila-filtro-oculto {
  display: none;
}

#tablaConfigRecordatoriosDestinatarios th.config-rd-col-correo,
#tablaConfigRecordatoriosDestinatarios td.config-rd-col-correo {
  width: 80px;
  min-width: 80px;
  max-width: 80px;
  box-sizing: border-box;
  text-align: center;
  vertical-align: middle;
}

#tablaConfigRecordatoriosDestinatarios th.config-rd-col-push,
#tablaConfigRecordatoriosDestinatarios td.config-rd-col-push {
  width: 80px;
  min-width: 80px;
  max-width: 80px;
  box-sizing: border-box;
  text-align: center;
  vertical-align: middle;
}

#tablaConfigRecordatoriosDestinatarios td.table-actions.table-actions-col.config-rd-col-acciones {
  width: 96px;
  min-width: 96px;
  max-width: 96px;
  box-sizing: border-box;
  vertical-align: middle;
}

#tablaConfigRecordatoriosDestinatarios th.table-actions-col.config-rd-col-acciones {
  width: 96px;
  min-width: 96px;
  max-width: 96px;
  box-sizing: border-box;
  vertical-align: middle;
}

.config-edit-actions {
  display: flex;
  align-items: center;
  justify-content: center;
}

.config-percent-input {
  display: flex;
  align-items: center;
  gap: 6px;
}

.config-percent-input input {
  text-align: right;
}

.config-percent-symbol {
  color: #4b5563;
  font-size: 13px;
  font-weight: 700;
}

.config-tipo-pago-comision-cell {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.config-tipo-pago-comision-cell-vacia {
  min-height: 40px;
}

.config-tipo-pago-comision-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 28px;
  width: 28px;
  flex-shrink: 0;
  margin: 0;
  cursor: pointer;
  margin-bottom: 0 !important;
}

.config-tipo-pago-comision-check:hover,
.config-tipo-pago-comision-check input[type="checkbox"]:hover {
  cursor: pointer;
}

.config-tipo-pago-comision-check input[type="checkbox"] {
  margin: 0;
  width: 16px;
  height: 16px;
  min-width: 16px;
  cursor: pointer;
}

.config-tipo-pago-comision-check input[type="checkbox"]:disabled {
  cursor: not-allowed;
}

.config-tipo-pago-comision-cell .config-percent-input {
  flex: 1 1 auto;
  min-width: 0;
  width: calc(100% - 36px);
}

.config-multi-combo {
  position: relative;
}

.config-multi-combo-trigger {
  width: 100%;
  min-height: 40px;
  padding: 10px 52px 10px 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background: #ffffff;
  color: #111827;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  position: relative;
}

.config-multi-combo-trigger::after {
  content: "▼";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #111827;
  font-size: 14px;
  line-height: 1;
  font-weight: 400;
  pointer-events: none;
}

.config-multi-combo-trigger:disabled {
  background: #f3f4f6;
  color: #6b7280;
  cursor: not-allowed;
}

.config-multi-combo-trigger:disabled::after {
  color: #6b7280;
}

.config-multi-combo-dropdown {
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  bottom: auto;
  max-height: min(50vh, 480px);
  overflow-y: auto;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 14px 26px rgba(15, 23, 42, 0.14);
  z-index: 1200;
}

.config-multi-combo-dropdown.open-up {
  top: auto;
  bottom: calc(100% + 4px);
}

.config-multi-combo.open .config-multi-combo-dropdown {
  display: block;
}

.table-filter-combo.open .config-multi-combo-dropdown {
  display: block;
}

body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes .list-toolbar .toolbar-more-trigger,
body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes .list-toolbar .list-toolbar-more-menu,
body.is-mobile[data-mobile-list-footer="presupuestos"] #vistaPresupuestos .list-toolbar .toolbar-more-trigger,
body.is-mobile[data-mobile-list-footer="presupuestos"] #vistaPresupuestos .list-toolbar .list-toolbar-more-menu,
body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar .toolbar-more-trigger,
body.is-mobile[data-mobile-list-footer="ventas"] #vistaVentas .list-toolbar .list-toolbar-more-menu,
body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .toolbar-more-trigger,
body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .list-toolbar .list-toolbar-more-menu {
  order: 1;
  flex-shrink: 0;
}

body.is-mobile[data-mobile-list-footer="pacientes"] #vistaClientes .table-filter-combo.open .config-multi-combo-dropdown,
body.is-mobile[data-mobile-list-footer="transacciones"] #vistaTransacciones .table-filter-combo.open .config-multi-combo-dropdown {
  position: fixed;
  left: 8px;
  right: 8px;
  top: auto;
  bottom: calc(env(safe-area-inset-bottom, 0px) + var(--vv-keyboard-inset, 0px) + 58px);
  width: auto;
  max-width: none;
  max-height: min(220px, calc(100vh - 120px));
  z-index: 1250;
}

.table-filter-combo .client-tags-filter-dropdown,
#filtroTransaccionesEtiquetasDropdown {
  left: auto;
  right: 0;
  width: max-content;
  max-width: min(360px, calc(100vw - 16px));
  overflow-x: hidden;
}

.config-multi-option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  cursor: pointer;
  font-size: 13px;
}

.config-multi-option:hover {
  background: #eff6ff;
}

.config-multi-option input {
  width: 16px;
  min-width: 16px;
  height: 16px;
  margin: 0;
}

.config-empty-state {
  padding: 14px;
  border: 1px dashed #d1d5db;
  border-radius: 10px;
  color: #6b7280;
  background: #f9fafb;
  font-size: 13px;
}

.config-pending-box {
  padding: 16px;
  border: 1px dashed #bfdbfe;
  border-radius: 10px;
  background: #eff6ff;
  color: #1f2937;
  line-height: 1.45;
}

.email-integration-grid {
  display: grid;
  gap: 14px;
}

.email-integration-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 16px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #ffffff;
}

.email-integration-card.disabled {
  background: #f9fafb;
}

.email-integration-card.is-collapsible {
  grid-template-columns: 1fr;
  align-items: stretch;
  gap: 0;
}

.email-integration-card.is-collapsible.is-collapsed {
  gap: 0;
}

.email-integration-card.is-collapsible.is-collapsed .email-integration-card-body,
.email-integration-card.is-collapsible.is-collapsed .email-integration-card-toolbar {
  display: none;
}

.email-integration-card-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
  color: inherit;
  font: inherit;
}

.email-integration-card-toggle .email-integration-title {
  margin: 0;
  flex: 1;
}

.email-integration-card-toggle-chevron {
  flex-shrink: 0;
  font-size: 14px;
  line-height: 1;
  color: #6b7280;
  transition: transform 0.15s ease;
}

.email-integration-card.is-collapsed .email-integration-card-toggle-chevron {
  transform: rotate(-90deg);
}

.email-integration-card-body {
  margin-top: 12px;
}

.email-integration-card-toolbar {
  margin-top: 12px;
  display: flex;
  justify-content: flex-end;
}

.email-integration-title {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 0 0 6px;
  font-size: 15px;
  font-weight: 700;
  color: #111827;
}

.email-integration-description,
.email-integration-meta {
  margin: 0;
  color: #6b7280;
  font-size: 13px;
  line-height: 1.45;
}

.email-integration-meta {
  margin-top: 8px;
  color: #374151;
}

.config-calendar-sync-rules {
  margin-top: 30px;
}

.config-calendar-sync-rules-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: end;
}

.config-calendar-sync-rules-actions {
  flex-shrink: 0;
}

.whatsapp-alfer-template {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
  gap: 16px;
  align-items: start;
  margin-bottom:70px;
  margin-right:30px;
}

.email-integration-card.whatsapp-alfer-templates-card {
  grid-template-columns: 1fr;
  align-items: stretch;
}

.whatsapp-alfer-templates-list {
  display: grid;
  gap: 16px;
  margin-top: 40px;
}

.whatsapp-template-preview {
  border: 1px solid #d1d5db;
  border-radius: 16px;
  background: #f3f4f6;
  overflow: hidden;
}

.whatsapp-template-preview-header {
  min-height: 132px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #dbeafe 0%, #ecfeff 100%);
  color: #1e3a8a;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
  padding: 14px;
}

.whatsapp-template-preview-header img {
  max-width: 100%;
  width: 100%;
  height: auto;
  vertical-align: top;
  display: none;
}

.whatsapp-template-preview.has-image .whatsapp-template-preview-header {
  padding: 0;
  min-height: 0;
  display: block;
}

.whatsapp-template-preview.has-image .whatsapp-template-preview-header span {
  display: none;
}

.whatsapp-template-preview.has-image .whatsapp-template-preview-header img {
  display: block;
}

.whatsapp-template-preview-body {
  padding: 12px;
  background: #ffffff;
  color: #111827;
  font-size: 13px;
  line-height: 1.45;
  white-space: pre-line;
}

.whatsapp-template-preview-buttons {
  display: grid;
  gap: 8px;
  padding: 0 12px 12px;
  background: #ffffff;
}

.whatsapp-template-preview-button {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  color: #1d4ed8;
  font-size: 13px;
  font-weight: 700;
}

.whatsapp-alfer-upload {
  display: grid;
  gap: 12px;
  align-content: start;
  padding-left:30px;
  padding-right:30px;
}

.whatsapp-alfer-upload .config-logo-dropzone {
  max-width:300px;
}



.whatsapp-alfer-template-title {
  margin: 0;
  color: #111827;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25;
}

.whatsapp-alfer-template-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.whatsapp-alfer-template-actions {
  justify-content: flex-start;
}

/* Destructivo dentro de toolbar: el estilo genérico .toolbar-actions button es azul */
.whatsapp-alfer-template-actions button.danger {
  background: #dc2626;
  color: #ffffff;
}

.whatsapp-alfer-template-actions button.danger:hover {
  background: #b91c1c;
}

.email-status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #f3f4f6;
  color: #374151;
  font-size: 12px;
  font-weight: 700;
}

.email-status-badge.connected {
  background: #c4f7d6;
  color: #166534;
}

.email-status-badge.pending {
  background: #eff6ff;
  color: #1d4ed8;
}

.email-status-badge.error {
  background: #fee2e2;
  color: #991b1b;
}

.config-section-actions {
  margin-bottom: 12px;
}

.config-logo-card {
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  padding: 16px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #ffffff;
}

.config-logo-dropzone {
  width: 100%;
  min-height: 184px;
  padding: 16px;
  border: 2px dashed #cbd5e1;
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  color: #334155;
  cursor: pointer;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
  text-align: center;
}

.config-logo-dropzone:hover,
.config-logo-dropzone:focus-visible,
.config-logo-dropzone.is-drag-over {
  border-color: #2563eb;
  background: #eff6ff;
  box-shadow: 0 14px 28px rgba(37, 99, 235, 0.12);
  outline: none;
  transform: translateY(-1px);
}

.config-logo-preview {
  width: 100%;
  height: 108px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.72);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  color: #64748b;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
}

.eecc-upload-stack .config-logo-preview {
  height: 50px;
}

.config-logo-dropzone-icon {
  width: 34px;
  height: 34px;
  margin: 0 auto 10px;
  border-radius: 12px;
  background: #dbeafe;
  color: #1d4ed8;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 700;
}

.config-logo-dropzone-title {
  margin: 10px 0 2px;
  color: #111827;
  font-size: 14px;
  font-weight: 700;
}

.config-logo-dropzone-subtitle {
  margin: 0;
  color: #64748b;
  font-size: 12px;
  line-height: 1.35;
}

.config-logo-file-name {
  min-height: 18px;
  margin: 6px 0 0;
  color: #2563eb;
  font-size: 12px;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.config-logo-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.config-logo-preview img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: none;
}

.config-logo-preview.has-logo img {
  display: block;
}

.config-logo-preview.has-logo span {
  display: none;
}

.config-logo-actions {
  display: grid;
  gap: 10px;
}

.config-logo-hint {
  margin: 0;
  color: #6b7280;
  font-size: 13px;
  line-height: 1.45;
}

@media (max-width: 900px) {
  .config-layout {
    grid-template-columns: 1fr;
    min-width: 0;
  }

  .config-menu {
    position: static;
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    overflow-x: auto;
    padding-bottom: 4px;
    min-width: 0;
    max-width: 100%;
  }

  .config-menu-button {
    width: auto;
    min-width: max-content;
    white-space: nowrap;
  }

  /* Finanzas › Modos de pago: layout tipo tarjeta desde tablet */
  #configTiposPagoContainer .config-edit-row:not(.config-edit-header) {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 10px 12px;
    align-items: start;
    padding: 14px 16px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #ffffff;
    box-sizing: border-box;
  }

  #configTiposPagoContainer .config-edit-row:not(.config-edit-header) > .field:first-child {
    grid-column: 1;
    grid-row: 1;
    margin: 0;
    min-width: 0;
  }

  #configTiposPagoContainer .config-edit-row:not(.config-edit-header) > .config-edit-actions {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    align-self: start;
  }

  #configTiposPagoContainer .config-edit-row:not(.config-edit-header) > .field:nth-child(2) {
    grid-column: 1 / -1;
    grid-row: 2;
    margin: 0;
    max-width: none;
    width: 100%;
  }

  #configTiposPagoContainer .config-edit-table {
    gap: 12px;
  }

  #configTiposPagoContainer .config-edit-header {
    display: none;
  }

  /* Finanzas › Comprobantes de pago: layout tipo tarjeta desde tablet */
  #configComprobantesPagoContainer .config-edit-row:not(.config-edit-header) {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto;
    gap: 10px 12px;
    align-items: start;
    padding: 14px 16px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #ffffff;
    box-sizing: border-box;
  }

  #configComprobantesPagoContainer .config-edit-row:not(.config-edit-header) > .field:first-child {
    grid-column: 1;
    grid-row: 1;
    margin: 0;
    min-width: 0;
  }

  #configComprobantesPagoContainer .config-edit-row:not(.config-edit-header) > .config-edit-actions {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    align-self: start;
  }

  #configComprobantesPagoContainer .config-edit-table {
    gap: 12px;
  }

  #configComprobantesPagoContainer .config-edit-header {
    display: none;
  }
}

@media (max-width: 680px) {
  .config-edit-row,
  .config-edit-row.account-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .config-edit-row .field,
  .config-edit-row .config-multi-combo {
    min-width: 0;
  }

  .config-cuenta-card .field,
  .config-cuenta-card .config-multi-combo {
    min-width: 0;
  }

  .config-cuenta-card-row-top {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .config-logo-card {
    grid-template-columns: 1fr;
  }

  .consent-fisico-upload .config-logo-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .email-integration-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .config-calendar-sync-rules-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .config-calendar-sync-rules-actions {
    justify-content: flex-start;
  }

  .eecc-upload-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .whatsapp-alfer-template {
    grid-template-columns: 1fr;
  }

  .config-edit-header {
    display: none;
  }

  .config-edit-actions {
    justify-content: flex-start;
  }
}

.page-loading {
  position: fixed;
  top: var(--page-loading-top, 0);
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(244, 246, 248, 0.94);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 11000;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.page-loading.visible {
  display: flex;
  opacity: 1;
}

body.has-modal-loading .page-loading {
  top: var(--page-loading-top, 0);
}

.dialog-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(17, 24, 39, 0.42);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 10000;
  padding: 16px;
  box-sizing: border-box;
}

.dialog-backdrop.visible {
  display: flex;
}

#appDialog {
  z-index: 10020;
}

.dialog {
  width: 100%;
  max-width: 420px;
  background: white;
  border-radius: 12px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.18);
  padding: 20px;
}

.dialog h3 {
  margin: 0 0 10px;
  font-size: 20px;
}

#appDialog .dialog-confirm-header {
  margin-bottom: 10px;
}

#appDialog .dialog-confirm-header h3 {
  margin: 0;
}

.dialog p {
  margin: 0;
  color: #111827;
  line-height: 1.45;
}

.dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 18px;
}

.dialog-actions button {
  min-width: 96px;
  padding: 10px 14px;
  border: none;
  border-radius: 8px;
  cursor: pointer;
}

.dialog-actions .secondary {
  background: #e5e7eb;
  color: #111827;
}

.dialog-actions .danger {
  background: #dc2626;
  color: white;
}

#presupuestoCompartirDialog.dialog-backdrop.visible,
#consentimientoCompartirDialog.dialog-backdrop.visible {
  align-items: flex-start;
  justify-content: center;
  padding-top: 30px;
  padding-right: max(16px, env(safe-area-inset-right, 0px));
  padding-bottom: 48px;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
}

.dialog-share-presupuesto {
  box-sizing: border-box;
  max-width: 920px;
  width: 100%;
  min-width: 0;
  max-height: none;
  flex-shrink: 1;
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: relative;
  overflow: visible;
}

.presupuesto-share-dialog-header {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-shrink: 0;
  width: 100%;
  min-height: 34px;
  margin-bottom:20px;
}

.presupuesto-share-dialog-header h3 {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
  font-size: 20px;
  line-height: 1.25;
  padding-right: 4px;
}

#presupuestoCompartirDialog .presupuesto-share-dialog-header .clinical-evaluation-modal-close,
#consentimientoCompartirDialog .presupuesto-share-dialog-header .clinical-evaluation-modal-close {
  flex-shrink: 0;
  margin-left: auto;
}

.presupuesto-share-lead {
  margin: 0;
  flex-shrink: 0;
  color: #111827;
  font-size: 14px;
  line-height: 1.45;
}

.presupuesto-share-iframe-wrap {
  position: relative;
  flex-shrink: 0;
  overflow: hidden;
  min-height: 200px;
  height: auto;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #f4f6f8;
}

.presupuesto-share-iframe-loading {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background: #f3f4f6;
  border-radius: 9px;
}

.presupuesto-share-iframe-loading[aria-hidden="true"] {
  display: none;
}

.presupuesto-share-iframe-loading .spinner {
  width: 28px;
  height: 28px;
  border-width: 3px;
}

.presupuesto-share-iframe-loading-text {
  font-size: 14px;
  font-weight: 600;
  color: #374151;
}

/*
  Contenedor centrado hasta 650px; el iframe interno mide siempre ese ancho lógico
  y se escala con transform para ocupar ~100% en pantallas estrechas (sin scroll horizontal).
*/
.presupuesto-share-iframe-viewport {
  box-sizing: border-box;
  width: 100%;
  max-width: 650px;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  position: relative;
  z-index: 1;
  min-height: 120px;
  touch-action: auto;
}

.presupuesto-share-iframe-stage {
  width: 650px;
  transform-origin: 0 0;
}

.presupuesto-share-iframe-stage iframe {
  width: 650px;
  min-height: 320px;
  height: auto;
  border: none;
  display: block;
  background: white;
}

.presupuesto-share-url-buttons.actions {
  margin-top: 10px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}

.presupuesto-share-url-buttons.actions button {
  min-width: 0;
}

#presupuestoCompartirDialog .presupuesto-share-url-buttons.actions button.secondary,
#consentimientoCompartirDialog .presupuesto-share-url-buttons.actions button.secondary {
  background: #6b7280;
  color: white;
}

#presupuestoCompartirDialog .presupuesto-share-url-buttons.actions button.secondary:hover,
#consentimientoCompartirDialog .presupuesto-share-url-buttons.actions button.secondary:hover {
  background: #4b5563;
}

.presupuesto-share-url-area {
  flex-shrink: 0;
  padding: 12px 14px;
  background: #f3f4f6;
  border-radius: 10px;
  font-size: 13px;
  border: 1px solid #e5e7eb;
}

.presupuesto-share-vigencia {
  margin-top: 8px;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 10px;
  color: #374151;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
}

.presupuesto-share-url-text {
  word-break: break-all;
  color: #111827;
  line-height: 1.45;
  margin-bottom: 10px;
}
.presupuesto-share-copy-hint {
  margin: 0;
  color: #059669;
  font-weight: 700;
}

.presupuesto-share-copy-hint.is-error {
  color: #b91c1c;
}

.consent-share-zoom-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 4px 0 10px;
}

.consent-share-zoom-toolbar .consent-share-zoom-btn {
  min-width: 40px;
  padding: 6px 10px;
  border-radius: 8px;
}

.consent-share-zoom-pct {
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  min-width: 48px;
  text-align: center;
}

.consent-vars-grid-full {
  grid-column: 1 / -1;
}

.consent-form-zone {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  min-width: 0;
}

.consent-form-zone .field.full {
  grid-column: 1 / -1;
}

#consentCamposVariablesDinamicos.grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  min-width: 0;
}

body.is-mobile .consent-form-zone,
body.is-mobile #consentCamposVariablesDinamicos.grid {
  grid-template-columns: minmax(0, 1fr);
}

#consentHojaInternaWrap {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
}

#consentPanelExpediente,
#consentPanelExpediente > .grid,
#consentPanelExpediente .field {
  min-width: 0;
}

#consentPanelExpediente > .grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

#consentExpedienteVisorWrap {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

#vistaConsentimientoInformadoFormulario.is-expediente-firmado #consentHojaInternaWrap {
  margin-top: 16px;
}

#vistaConsentimientoInformadoFormulario.is-expediente-firmado .consent-hoja-interna-viewport,
#vistaConsentimientoInformadoFormulario.is-expediente-firmado .consent-hoja-interna-scroller {
  overflow: hidden;
  max-height: none;
}

.consent-fisico-actions {
  justify-content: flex-start;
  gap: 10px;
  margin-top: 0;
  flex-wrap: wrap;
}

.consent-fisico-actions .config-logo-hint {
  flex-basis: 100%;
}

.consent-fisico-upload-button {
  display: none;
}

.consent-fisico-upload {
  container-type: inline-size;
}

.consent-fisico-upload .config-logo-card {
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
}

@container (max-width: 520px) {
  .consent-fisico-upload .config-logo-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
}

@media (max-width: 900px) {
  .consent-fisico-upload .config-logo-card {
    display: block;
    padding: 0;
    border: none;
    background: transparent;
  }

  .consent-fisico-upload .config-logo-dropzone {
    display: none;
  }

  .consent-fisico-upload .config-logo-actions {
    gap: 8px;
  }

  .consent-fisico-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 10px;
  }

  .consent-fisico-actions button {
    width: 100%;
  }

  .consent-fisico-upload-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .consent-fisico-upload .config-logo-hint {
    grid-column: 2;
    margin-top: -2px;
  }
}

@media (max-width: 680px) {
  .consent-fisico-actions {
    grid-template-columns: 1fr;
  }

  .consent-fisico-upload-button {
    order: 2;
  }

  .consent-fisico-upload .config-logo-hint {
    grid-column: auto;
    order: 3;
    margin-top: 0;
  }
}

.consent-fisico-preview-wrap {
  width: 100%;
  max-width: 650px;
  margin: 16px auto 0;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #f8fafc;
  overflow: visible;
  padding: 0;
  box-sizing: border-box;
}

.consent-fisico-preview-wrap img {
  display: block;
  width: 100%;
  max-width: 650px;
  height: auto;
  margin: 0 auto;
  border-radius: 12px;
  background: white;
}

.consent-fisico-pages {
  display: flex;
  flex-direction: column;
  gap: 18px;
  margin-top: 16px;
}

.consent-fisico-page {
  width: 100%;
  max-width: 690px;
  margin: 0 auto;
  padding: 14px;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  background: #ffffff;
  box-sizing: border-box;
}

.consent-fisico-page-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.consent-fisico-page-title {
  font-weight: 700;
  color: #0f172a;
}

.consent-fisico-page-actions {
  display: inline-flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.consent-fisico-page-actions .icon-button,
.consent-fisico-page-actions .action-placeholder {
  width: 40px;
  height: 40px;
  border-radius: 8px;
}

.consent-fisico-remove-wrap {
  max-width: 650px;
  margin: 16px auto 0;
  display: flex;
  justify-content: flex-end;
}

.consent-fisico-remove-button {
  padding: 0;
  min-width: 34px;
  min-height: 34px;
}

.consent-fisico-page-actions .icon-button.danger {
  background: #dc2626;
  border-color: #dc2626;
  color: #ffffff;
}

.consent-fisico-page-actions .icon-button.danger:hover {
  background: #b91c1c;
  border-color: #b91c1c;
}

.budget-line-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 100px 50px 100px 100px 100px 34px;
  gap: 12px;
  align-items: end;
  margin-bottom: 12px;
}

.budget-expense-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 120px 34px;
  gap: 12px;
  align-items: end;
  margin-bottom: 12px;
}

.budget-form-table {
  margin-top: 8px;
}

.budget-form-header {
  display: grid;
  gap: 12px;
  align-items: center;
  padding: 0 0 4px;
  margin-bottom: 6px;
  color: #111827;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.2;
}

.budget-detail-header {
  grid-template-columns: minmax(0, 1fr) 100px 50px 100px 100px 100px 34px;
}

.budget-detail-header > div {
  text-align: left;
}

.budget-gastos-header {
  grid-template-columns: minmax(0, 1fr) 120px 34px;
}

.budget-gastos-header > div {
  text-align: left;
}

.budget-line-service {
  min-width: 0;
}

.budget-line-mobile-label {
  display: none;
  margin-bottom: 4px;
  color: #6b7280;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
}

.budget-line-qty {
  width: 50px;
  min-width: 50px;
  max-width: 50px;
}

.budget-line-price,
.budget-line-discount,
.budget-line-subtotal,
.budget-line-total {
  width: 100px;
  min-width: 100px;
  max-width: 100px;
}

.amount-input,
.amount-display {
  text-align: right;
}

.money-input-wrapper {
  position: relative;
  display: block;
  min-width: 132px;
  width: 100%;
}

.money-input-wrapper .amount-input {
  box-sizing: border-box;
  width: 100%;
  padding-left: 25px;
}

.budget-line-price .money-input-wrapper,
.budget-line-discount .money-input-wrapper,
.budget-line-subtotal .money-input-wrapper,
.budget-line-total .money-input-wrapper,
.budget-line-total-field .money-input-wrapper,
.budget-expense-amount .money-input-wrapper,
.service-cost-amount .money-input-wrapper,
.service-price-field .money-input-wrapper,
.gasto-flujo-caja-monto-field .money-input-wrapper,
.eecc-manual-field-monto .money-input-wrapper,
.budget-totals-value .money-input-wrapper {
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

.money-input-prefix {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
  pointer-events: none;
  z-index: 1;
}

.budget-expense-amount {
  width: 120px;
  min-width: 120px;
  max-width: 120px;
}

.budget-section {
  margin-top: 0;
  padding-top: 22px;
  border-top: 1px solid #e5e7eb;
}

.budget-section-intro {
  margin-bottom: 20px;
  padding-top: 0;
  border-top: none;
}

.budget-intro-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 0.8fr) 42px;
  gap: 15px;
}

.budget-section-intro > .budget-intro-grid + .budget-intro-grid,
.budget-section-intro > .sale-main-grid + .sale-reference-grid,
.budget-section-intro > .sale-reference-grid + .sale-reference-grid {
  margin-top: 12px;
}

.budget-intro-grid-spacer,
.budget-intro-grid-corner-spacer {
  min-height: 0;
  pointer-events: none;
}

.budget-settings-field {
  align-items: flex-end;
}

.sale-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr) 42px;
  gap: 15px;
  align-items: end;
}

.sale-reference-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr);
  gap: 15px;
}

.cost-row {
  display: grid;
  grid-template-columns: 1fr 1.2fr 1fr 0.9fr auto;
  gap: 12px;
  align-items: end;
  margin-bottom: 12px;
}

.service-cost-row {
  grid-template-columns: minmax(0, 1fr) 132px auto;
}

.service-cost-concept {
  min-width: 0;
}

.service-cost-amount {
  width: 132px;
  min-width: 132px;
  max-width: 132px;
}

@media (min-width: 641px) {
  #listaGastosServicio .service-cost-row {
    grid-template-columns: minmax(0, 1fr) minmax(132px, 132px) minmax(34px, 34px);
    gap: 15px;
    align-items: end;
  }

  #listaGastosServicio .service-cost-row .budget-remove-button {
    justify-self: center;
    margin-inline-start: 0;
  }
}

.budget-services-section {
  padding-bottom: 18px;
}

.budget-services-actions {
  margin-top: 16px;
}

#vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto.budget-line-primera > .budget-line-card-menu {
  display: none !important;
}

#vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta.budget-line-primera > .budget-line-card-menu {
  display: none !important;
}

.budget-section-title {
  margin: 0 0 14px;
  color: #111827;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.budget-form-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.budget-totals {
  width: 100%;
  max-width: 420px;
  margin-top: 20px;
  margin-left: auto;
  border-top: 1px solid #d1d5db;
  padding-top: 12px;
}

.budget-totals-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 140px;
  gap: 16px;
  align-items: center;
  padding: 8px 0;
}

.budget-totals-label {
  color: #111827;
  font-weight: bold;
}

.budget-totals-value {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.budget-totals-row.total {
  border-top: 1px solid #e5e7eb;
  margin-top: 4px;
  padding-top: 12px;
}

.budget-totals-row.total .budget-totals-label,
.budget-totals-row.total .budget-totals-value {
  font-size: 18px;
  color: #111827;
}

.budget-gastos-section {
  margin-top: 30px;
  padding-top: 22px;
  border-top: 1px solid #e5e7eb;
}

.budget-gastos-summary {
  width: 100%;
  max-width: 420px;
  margin-top: 16px;
  margin-left: auto;
  border-top: 1px solid #d1d5db;
  padding-top: 12px;
}

.budget-gastos-section .budget-section-title {
  margin-bottom: 10px;
  font-size: 12px;
}

.consent-form-zone + .consent-form-zone {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid #e5e7eb;
}

.consent-zone-fields {
  display: contents;
}

.consent-hoja-interna-viewport {
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #f4f6f8;
  padding: 0;
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  min-height: 200px;
}

.consent-hoja-zoom-bar {
  display: none;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 8px;
}

.consent-hoja-interna-scroller {
  box-sizing: border-box;
  width: 100%;
  max-width: 650px;
  min-width: 0;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  position: relative;
  z-index: 1;
  min-height: 120px;
  touch-action: auto;
}

.consent-hoja-interna-stage {
  width: 650px;
  transform-origin: 0 0;
}

.consent-hoja-interna-stage iframe {
  box-sizing: border-box;
  width: 650px;
  min-height: 320px;
  height: auto;
  border: none;
  display: block;
  background: white;
}

.consent-hoja-sheet {
  width: 650px;
  max-width: none;
  margin: 0 auto;
  padding: 22px 24px;
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.12);
}

.consent-document-text {
  white-space: pre-wrap;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  line-height: 1.38;
  color: #111827;
  text-align: left;
}

.consent-signature-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  align-items: end;
  margin-top: 22px;
  padding-top: 12px;
}

.consent-signature-box {
  min-height: 96px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.consent-signature-image-slot {
  height: 58px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  margin-bottom: 6px;
}

.consent-signature-image-slot img,
.consent-firma-img-slot img {
  max-width: 180px;
  max-height: 56px;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}

.consent-signature-line {
  border-top: 1px solid #111827;
  padding-top: 5px;
  font-size: 12px;
  line-height: 1.25;
}

.clinical-evaluation-modal.recordatorio-modal {
  width: min(880px, calc(100vw - 32px));
  overflow-x: hidden;
}

#puestoTrabajoConfigDialog .clinical-evaluation-modal.recordatorio-modal {
  width: min(600px, calc(100vw - 32px));
  max-width: 600px;
}

#empleadoConfigDialog .config-catalog-dialog-footer,
#puestoTrabajoConfigDialog .config-catalog-dialog-footer {
  justify-content: flex-end;
}

#empleadoConfigDialog .config-catalog-dialog-footer button,
#puestoTrabajoConfigDialog .config-catalog-dialog-footer button {
  flex: 0 0 auto;
  width: auto;
}

.recordatorio-form-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px 120px;
  gap: 14px;
  align-items: start;
}

.recordatorio-motivo-field {
  grid-column: 1 / -1;
}

.recordatorio-cliente-field .combo-select {
  width: 100%;
  min-width: 0;
}

.recordatorio-fecha-part-field {
  width: 150px;
  max-width: 100%;
  box-sizing: border-box;
}

.recordatorio-fecha-part-field input[type="date"] {
  width: 150px;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  color: #111827;
}

.recordatorio-fecha-part-field input[type="date"].recordatorio-fecha-vacia {
  color: #9ca3af;
}

.recordatorio-fecha-part-field input[type="date"].recordatorio-fecha-vacia::-webkit-datetime-edit-text,
.recordatorio-fecha-part-field input[type="date"].recordatorio-fecha-vacia::-webkit-datetime-edit-month-field,
.recordatorio-fecha-part-field input[type="date"].recordatorio-fecha-vacia::-webkit-datetime-edit-day-field,
.recordatorio-fecha-part-field input[type="date"].recordatorio-fecha-vacia::-webkit-datetime-edit-year-field {
  color: #9ca3af;
}

.recordatorio-fecha-part-field input[type="date"]:not(.recordatorio-fecha-vacia)::-webkit-datetime-edit-text,
.recordatorio-fecha-part-field input[type="date"]:not(.recordatorio-fecha-vacia)::-webkit-datetime-edit-month-field,
.recordatorio-fecha-part-field input[type="date"]:not(.recordatorio-fecha-vacia)::-webkit-datetime-edit-day-field,
.recordatorio-fecha-part-field input[type="date"]:not(.recordatorio-fecha-vacia)::-webkit-datetime-edit-year-field {
  color: inherit;
}

.recordatorio-hora-part-field {
  width: 120px;
  max-width: 100%;
  box-sizing: border-box;
}

.recordatorio-hora-part-field .combo-select {
  width: 120px;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.recordatorio-hora-part-field .combo-select-input {
  width: 120px;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.recordatorio-hora-part-field .combo-select-input::placeholder {
  color: #9ca3af;
  opacity: 1;
}

.recordatorio-motivo-field textarea {
  min-height: 43px;
}

body.is-mobile .recordatorio-form-grid {
  grid-template-columns: minmax(0, 1fr);
}

body.is-mobile .recordatorio-cliente-field,
body.is-mobile .recordatorio-fecha-part-field,
body.is-mobile .recordatorio-hora-part-field,
body.is-mobile .recordatorio-motivo-field {
  grid-column: 1 / -1;
}

body.is-mobile .recordatorio-fecha-part-field,
body.is-mobile .recordatorio-hora-part-field {
  width: 100%;
  min-width: 0;
}

body.is-mobile .recordatorio-fecha-part-field input[type="date"] {
  min-width: 0;
  width: 100%;
}

body.is-mobile .recordatorio-hora-part-field .combo-select {
  min-width: 0;
  width: 100%;
}

body.is-mobile .recordatorio-hora-part-field .combo-select-input {
  min-width: 0;
  width: 100%;
}

body.is-mobile .clinical-evaluation-modal.recordatorio-modal .recordatorio-motivo-field textarea {
  min-height: 42px;
  height: 42px;
  max-height: 42px;
  resize: none;
  overflow-y: auto;
  line-height: 1.25;
}

.recordatorio-list {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.recordatorio-list-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #f9fafb;
}

.recordatorio-list-item.reminder-overdue {
  background: #fee2e2;
  border-color: #fca5a5;
}

.recordatorio-list-item.reminder-sent {
  background: #f0fdf4;
  border-color: #bbf7d0;
}

.recordatorio-list-item.reminder-soon {
  background: #fefce8;
  border-color: #fde68a;
}

.recordatorio-list-title {
  font-weight: 700;
  color: #111827;
}

.recordatorio-list-meta {
  margin-top: 4px;
  color: #374151;
  font-size: 13px;
}

.recordatorio-list-actions {
  display: flex;
  gap: 6px;
}

.clinical-evaluation-dialog {
  align-items: flex-start;
}

body:not(.is-mobile) .clinical-evaluation-dialog {
  left: var(--menu-collapsed-width);
}

.clinical-evaluation-modal {
  position: relative;
  width: min(1180px, calc(100vw - 32px));
  max-width: none;
  max-height: calc(100vh - 32px);
  overflow: auto;
  padding: 0;
}

body:not(.is-mobile) .clinical-evaluation-modal {
  width: min(1180px, calc(100vw - var(--menu-collapsed-width) - 32px));
}

#citaEstadoPickerDialog .clinical-evaluation-modal.recordatorio-modal.cita-estado-picker-modal {
  width: min(300px, calc(100vw - 32px));
  max-width: 300px;
  height: auto;
  max-height: calc(100dvh - 32px);
  overflow: hidden;
  padding: 0;
}

body:not(.is-mobile) #citaEstadoPickerDialog .clinical-evaluation-modal.recordatorio-modal.cita-estado-picker-modal {
  width: min(300px, calc(100vw - var(--menu-collapsed-width) - 32px));
  max-width: 300px;
}

.clinical-evaluation-modal-header {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 22px;
  background: #ffffff;
  border-bottom: 1px solid #e5e7eb;
}

.clinical-evaluation-modal-header h3 {
  margin: 0;
}

.clinical-evaluation-modal-close {
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
  border: none;
  border-radius: 999px;
  background: #f3f4f6;
  color: #111827;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.clinical-evaluation-modal-body {
  padding: 22px;
}

.clinical-evaluation-modal-body .clinical-form-card {
  border: none;
  padding: 0;
  padding-bottom: 0;
}

.clinical-evaluation-modal-body .form-actions-sticky {
  margin-bottom: 0;
  margin-left: -22px;
  margin-right: -22px;
  padding-left: 22px;
  padding-right: 22px;
}

.servicios-excel-modal {
  width: min(720px, calc(100vw - 32px));
}

.servicios-excel-tabs {
  margin-bottom: 18px;
}

.servicios-excel-panel.active {
  gap: 16px;
  margin-bottom: 0;
}

.servicios-excel-dropzone {
  width: 100%;
  min-height: 180px;
}

.servicios-excel-dropzone.drag-over {
  border-color: #16a34a;
  background: #f0fdf4;
}

.servicios-excel-import-preview {
  min-height: 24px;
}

.servicios-excel-summary {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px;
  border: 1px solid #d1fae5;
  border-radius: 10px;
  background: #f0fdf4;
  color: #14532d;
}

.servicios-excel-errors {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 10px;
  padding: 12px;
  border: 1px solid #fecaca;
  border-radius: 10px;
  background: #fef2f2;
  color: #991b1b;
  font-size: 13px;
}

.clinical-action-short {
  display: none;
}

.client-action-short {
  display: none;
}

body.is-menu-collapsed .menu,
body.is-compact:not(.is-mobile):not(.is-menu-open) .menu {
  width: var(--menu-collapsed-width);
  min-width: var(--menu-collapsed-width);
  padding: 16px 10px;
}

body.is-compact:not(.is-mobile):not(.is-menu-open) .menu-logo {
  justify-content: center;
  margin-bottom: 26px;
}

body.is-compact:not(.is-mobile):not(.is-menu-open) .menu-logo-text,
body.is-compact:not(.is-mobile):not(.is-menu-open) .menu-label {
  display: none;
}

body.is-menu-collapsed:not(.is-compact) .menu-logo {
  margin-bottom: 26px;
}

body.is-menu-collapsed .menu-version,
body.is-compact:not(.is-mobile):not(.is-menu-open) .menu-version {
  visibility: hidden;
  overflow: hidden;
  max-height: calc(11px * 1.35);
  flex-shrink: 0;
}

body.is-menu-collapsed .menu-logo-placeholder,
body.is-compact:not(.is-mobile):not(.is-menu-open) .menu-logo-placeholder {
  width: 36px;
  height: 36px;
  min-width: 36px;
}

body.is-compact:not(.is-mobile):not(.is-menu-open) .menu button {
  justify-content: center;
  padding: 10px;
}

body.is-menu-collapsed:not(.is-compact) .menu-nav button {
  justify-content: flex-start;
  padding: 10px;
  position: relative;
  overflow: visible;
}

body:not(.is-compact) .menu {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: var(--menu-collapsed-width);
  min-width: var(--menu-collapsed-width);
  z-index: 11100;
  --menu-logo-size: 36px;
  --menu-logo-collapsed-start: calc((var(--menu-collapsed-width) - 20px - var(--menu-logo-size)) / 2);
  --menu-label-offset: 40px;
}

body:not(.is-compact) .menu-nav button {
  justify-content: flex-start;
  padding: 10px;
  position: relative;
  overflow: visible;
}

body:not(.is-compact) .menu-label {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  left: var(--menu-label-offset);
  top: 50%;
  right: 4px;
  transform: translateY(-50%);
  pointer-events: none;
  white-space: nowrap;
  transition: opacity 0.15s ease, visibility 0.15s ease;
}

body:not(.is-compact) .menu-logo-text {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  left: calc(var(--menu-logo-collapsed-start) + var(--menu-logo-size) + 8px);
  top: 50%;
  right: 4px;
  transform: translateY(-50%);
  pointer-events: none;
  transition: opacity 0.15s ease, visibility 0.15s ease;
}

body:not(.is-compact) .menu-version {
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  max-height: calc(11px * 1.35);
  flex-shrink: 0;
  transition: opacity 0.15s ease, visibility 0.15s ease;
}

body:not(.is-compact) .menu-logo-placeholder {
  width: var(--menu-logo-size);
  height: var(--menu-logo-size);
  min-width: var(--menu-logo-size);
  flex-shrink: 0;
}

body:not(.is-compact) .menu button.menu-logo,
body.is-menu-collapsed:not(.is-compact) .menu button.menu-logo {
  height: 52px;
  min-height: 52px;
  max-height: 52px;
  margin-bottom: 26px;
  flex-shrink: 0;
  justify-content: flex-start;
  padding-left: var(--menu-logo-collapsed-start);
  padding-right: 0;
  position: relative;
  overflow: visible;
}

body:not(.is-compact) .app-main {
  margin-left: var(--menu-collapsed-width);
}

body:not(.is-compact).is-menu-hover .menu,
body:not(.is-compact).is-menu-pinned .menu {
  width: 220px;
  min-width: 220px;
  padding: 16px 10px;
  box-shadow: 18px 0 35px rgba(0, 17, 38, 0.28);
}

body:not(.is-compact).is-menu-hover .menu-logo-text,
body:not(.is-compact).is-menu-pinned .menu-logo-text,
body:not(.is-compact).is-menu-hover .menu-label,
body:not(.is-compact).is-menu-pinned .menu-label,
body:not(.is-compact).is-menu-hover .menu-version,
body:not(.is-compact).is-menu-pinned .menu-version {
  opacity: 1;
  visibility: visible;
  overflow: visible;
  max-height: none;
}

body.is-compact.is-menu-open .menu {
  width: 220px;
  min-width: 220px;
  padding: 16px 12px;
}

body.is-mobile .menu {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: 11100;
  width: 220px;
  min-width: 220px;
  padding: 16px 12px;
  transform: translateX(-100%);
  box-shadow: none;
}

body.is-mobile {
  --page-loading-top: 56px;
}

body.is-mobile .menu-logo {
  justify-content: flex-start;
}

body.is-mobile .menu-logo-text,
body.is-mobile .menu-label,
body.is-mobile .menu-version {
  display: block;
  opacity: 1;
  visibility: visible;
  position: static;
  transform: none;
}

body.is-mobile .menu button {
  justify-content: flex-start;
  padding: 10px 12px;
}

body.is-mobile.is-menu-open .menu {
  transform: translateX(0);
  box-shadow: 18px 0 35px rgba(0, 17, 38, 0.28);
}

body.is-mobile::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 1290;
  pointer-events: none;
  background: rgba(15, 23, 42, 0);
  transition: background 0.2s ease;
}

body.is-mobile.is-menu-open::before {
  pointer-events: auto;
  background: rgba(15, 23, 42, 0.36);
}

.spinner-box {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.95);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

.spinner {
  width: 32px;
  height: 32px;
  border: 4px solid #d1d5db;
  border-top-color: #2563eb;
  border-radius: 50%;
  animation: girar 0.8s linear infinite;
}

@keyframes girar {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@media (max-width: 900px) {
  .clinical-evaluation-dialog {
    padding: 10px;
  }

  body:not(.is-mobile) .clinical-evaluation-dialog {
    left: var(--menu-collapsed-width);
  }

  .clinical-evaluation-modal {
    width: min(760px, calc(100vw - 20px));
    max-height: calc(100dvh - 20px);
    border-radius: 14px;
  }

  body:not(.is-mobile) .clinical-evaluation-modal {
    width: min(760px, calc(100vw - var(--menu-collapsed-width) - 20px));
  }

  .clinical-evaluation-modal-header {
    padding: 16px;
  }

  .clinical-evaluation-modal-body {
    padding: 16px;
  }

  .clinical-evaluation-modal-body .form-actions-sticky {
    position: sticky;
    bottom: 0;
    z-index: 35;
    margin: 20px -16px 0;
    padding: 12px 16px;
    background: #ffffff;
    border-top: 1px solid #e5e7eb;
    box-shadow: 0 -8px 18px rgba(15, 23, 42, 0.08);
  }

  .clinical-form-card .form-section {
    margin-top: 26px;
  }

  .clinical-history-header {
    flex-direction: column;
    margin-bottom: 30px;
  }

  .clinical-timeline {
    padding-left: 26px;
  }

  .clinical-timeline::before {
    left: 7px;
  }

  .clinical-timeline-end-label {
    left: 0px;
    transform: none;
  }

  .clinical-timeline-end-label--top {
    transform: translateY(-50%);
  }

  .clinical-timeline-end-label--bottom {
    transform: translateY(50%);
  }

  .clinical-timeline-date {
    position: static;
    width: auto;
    text-align: left;
    margin-bottom: 8px;
  }

  .clinical-timeline-dot {
    left: -25px;
    top: calc(17px - 18px);
  }

  .odontogram-root {
    display: flex;
    flex-direction: column;
    grid-template-columns: 1fr;
    gap: 14px;
    min-height: 0;
  }

  .odontogram-sidebar {
    display: contents;
    max-height: none;
    overflow: visible;
    padding-right: 0;
    padding-top: 0;
  }

  .odontogram-finding-editor {
    order: 2;
    width: 100%;
  }

  .odontogram-main {
    order: 1;
    width: 100%;
  }

  .odontogram-registered-findings {
    order: 3;
    width: 100%;
    box-sizing: border-box;
  }

  .odontogram-canvas-card {
    width: 100%;
    box-sizing: border-box;
  }

  .odontogram-main-actions {
    grid-template-columns: minmax(0, 1fr) auto;
    row-gap: 0;
  }

  .odontogram-main-actions .odontogram-dentition-field {
    grid-column: 1;
    grid-row: 1;
    justify-self: stretch;
  }

  .odontogram-dentition-field {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    column-gap: 8px;
  }

  .odontogram-dentition-field label {
    font-size: 12px;
    margin: 0;
    white-space: nowrap;
  }

  .odontogram-main-actions .odontogram-help-trigger {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    align-self: center;
  }

  .odontogram-main-actions .odontogram-register-button {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: stretch;
    margin-top: 20px;
  }

  .odontogram-finding-wizard-step[data-odontogram-wizard-step="1"] {
    gap: 4px;
  }

  .odontogram-finding-wizard-step[data-odontogram-wizard-step="1"] .odontogram-card-body {
    gap: 6px;
  }

  .odontogram-finding-wizard {
    padding: 10px;
  }

  .odontogram-finding-wizard-modal {
    width: min(760px, calc(100vw - 20px));
    max-height: calc(100dvh - 20px);
  }

  .odontogram-finding-wizard-header,
  .odontogram-finding-wizard-body,
  .odontogram-finding-wizard-actions {
    padding-left: 16px;
    padding-right: 16px;
  }

  .odontogram-finding-wizard-actions {
    position: sticky;
    bottom: 0;
    z-index: 2;
  }

  .clinical-fields,
  .clinical-field-row,
  .clinical-field-row.has-extra,
  .clinical-field-row.full {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .clinical-field-label,
  .clinical-field-control,
  .clinical-field-row:not(.has-extra):not(.full) .clinical-field-control,
  .clinical-field-row.full .clinical-field-control {
    grid-column: 1 / -1;
    width: 100%;
  }

  .clinical-field-control .combo-select,
  .clinical-field-control input,
  .clinical-field-control select,
  .clinical-field-control textarea {
    width: 100%;
    box-sizing: border-box;
  }

  .clinical-field-row.has-extra {
    gap: 8px;
  }

  .menu-version {
    margin-top: 14px;
    padding-top: 0;
  }

  .content {
    padding: 0;
  }
}

@media (max-width: 640px) {
  .clinical-evaluation-dialog {
    padding: 0;
  }

  #citaEstadoPickerDialog.dialog-backdrop.clinical-evaluation-dialog {
    align-items: center;
    justify-content: center;
    padding: 16px;
  }

  .clinical-evaluation-modal {
    width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    border-radius: 0;
  }

  #citaEstadoPickerDialog .clinical-evaluation-modal.recordatorio-modal.cita-estado-picker-modal {
    width: min(300px, calc(100vw - 32px));
    max-width: 300px;
    height: auto;
    max-height: calc(100dvh - 32px);
    border-radius: 12px;
  }

  .clinical-evaluation-modal-header {
    padding: 14px 16px;
  }

  .clinical-evaluation-modal-body {
    padding: 14px;
  }

  .clinical-evaluation-modal-body .form-actions-sticky {
    margin: 18px -14px 0;
    padding: 12px 14px;
  }

  .clinical-evaluation-modal-body .form-actions-sticky button {
    width: 100%;
  }

  /* Recordatorio: alto según contenido (no pantalla completa como evaluación clínica). */
  #recordatorioDialog.dialog-backdrop.clinical-evaluation-dialog {
    align-items: flex-start;
    justify-content: center;
    padding: max(12px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px))
      max(12px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
    overflow-x: hidden;
    overflow-y: auto;
    box-sizing: border-box;
  }

  #recordatorioDialog .clinical-evaluation-modal.recordatorio-modal {
    height: auto;
    width: min(760px, calc(100vw - 24px));
    max-height: calc(
      100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 24px
    );
    border-radius: 14px;
    overflow-x: hidden;
    overflow-y: auto;
  }

  /* Completar vínculo: alto según contenido; footer al pie del body. */
  #transactionLinkDialog.dialog-backdrop.clinical-evaluation-dialog {
    align-items: flex-start;
    justify-content: center;
    padding: max(12px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px))
      max(12px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
    overflow-x: hidden;
    overflow-y: auto;
    box-sizing: border-box;
  }

  #transactionLinkDialog .clinical-evaluation-modal.transaction-link-dialog-modal {
    height: auto;
    width: min(760px, calc(100vw - 24px));
    max-height: calc(
      100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 24px
    );
    border-radius: 14px;
    overflow: hidden;
  }

  #transactionLinkDialog .transaction-link-dialog-body {
    padding-bottom: 20px;
  }

  #transactionLinkDialog .clinical-evaluation-modal-footer.transaction-link-dialog-footer {
    padding-left: 16px;
    padding-right: 16px;
  }

  /* Detalle de cita: alto según contenido; footer fijo al pie del panel. */
  #citaDetalleDialog.dialog-backdrop.clinical-evaluation-dialog {
    align-items: flex-start;
    justify-content: center;
    padding: max(12px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px))
      max(12px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
    overflow-x: hidden;
    overflow-y: auto;
    box-sizing: border-box;
  }

  #citaDetalleDialog .clinical-evaluation-modal.cita-detalle-modal {
    height: auto;
    width: min(760px, calc(100vw - 24px));
    max-height: calc(
      100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 24px
    );
    border-radius: 14px;
    overflow: hidden;
  }

  .clinical-field-row {
    gap: 6px;
  }

  .clinical-field-label {
    font-size: 12px;
  }

  .clinical-form-card .form-section {
    margin-top: 30px;
  }

  .clinical-form-card .form-section h3 {
    margin-bottom: 12px;
  }

  .odontogram-panel {
    margin-left: -6px;
    margin-right: -6px;
  }

  .odontogram-root {
    gap: 12px;
  }

  .odontogram-finding-wizard {
    padding: 0;
  }

  .odontogram-finding-wizard-modal {
    width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    border-radius: 0;
  }

  .odontogram-finding-wizard-header {
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .odontogram-finding-wizard-body {
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .odontogram-wizard-canvas-card {
    max-height: none;
  }

  .odontogram-finding-wizard-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .odontogram-finding-wizard-actions button {
    align-items: center;
    display: inline-flex;
    flex: 0 1 auto;
    justify-content: center;
    min-width: 0;
    overflow: hidden;
    padding-left: 8px;
    padding-right: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto;
  }

  .odontogram-finding-wizard-actions button > span.action-btn-label,
  .odontogram-finding-wizard-actions button > span:not(:has(svg)) {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .odontogram-finding-wizard-actions button > span:has(svg) {
    flex-shrink: 0;
    overflow: visible;
  }

  .odontogram-main-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 12px;
  }

  .odontogram-dentition-field {
    width: 100%;
  }

  .odontogram-canvas-card {
    padding: 10px;
    overflow-x: hidden;
  }

  .odontogram-zoom-viewport {
    overflow: auto;
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
    touch-action: auto;
  }

  .odontogram-svg {
    max-width: none;
  }

  .odontogram-help-modal {
    width: calc(100vw - 20px);
    max-height: calc(100dvh - 20px);
    padding: 0;
  }

  .odontogram-help-modal-body {
    padding: 18px;
  }

  .odontogram-legend-row {
    grid-template-columns: 1fr;
    gap: 10px;
    align-items: stretch;
  }

  .odontogram-legend-preview {
    grid-template-columns: 1fr;
  }

  .odontogram-legend-variant {
    grid-template-columns: minmax(96px, 112px) minmax(0, 1fr);
  }

  .odontogram-actions button {
    width: 100%;
  }

  .content {
    padding: 0;
  }

  .card {
    padding: 18px;
    border-radius: 8px;
  }

  .card.full-width {
    border-radius: 0;
  }

  h1 {
    font-size: 28px;
  }

  .grid {
    grid-template-columns: 1fr;
  }

  .transaction-form-row.three-columns,
  .transaction-form-row.two-columns,
  .transaction-form-row-type-date-amount,
  .transaction-form-row-type-date-amount.has-comprobante-pago {
    grid-template-columns: 1fr;
  }

  .service-form-grid,
  .budget-intro-grid,
  .sale-main-grid,
  .sale-reference-grid {
    grid-template-columns: 1fr;
  }

  .budget-intro-grid .budget-intro-grid-spacer,
  .budget-intro-grid .budget-intro-grid-corner-spacer {
    display: none;
  }

  .sale-main-grid .budget-settings-field {
    justify-self: start;
  }

  .budget-form-topbar {
    align-items: flex-start;
  }

  .service-price-field,
  .transaction-field-tipo-wrap,
  .transaction-field-fecha,
  .transaction-field-monto,
  .transaction-field-comprobante,
  .budget-line-qty,
  .budget-line-price,
  .budget-line-discount,
  .budget-line-subtotal,
  .budget-line-total,
  .budget-expense-amount {
    width: 100%;
    min-width: 0;
    max-width: none;
  }

  #vistaServicioFormulario .service-price-field,
  #listaGastosServicio .service-cost-amount {
    width: 132px;
    min-width: 132px;
    max-width: 132px;
  }

  .actions {
    flex-direction: column;
  }

  .section-header,
  .list-toolbar,
  .toolbar-actions {
    align-items: stretch;
  }

  .list-toolbar {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .toolbar-actions {
    width: 100%;
  }

  .app-header-right {
    gap: 8px;
  }

  body.is-mobile #btnHeaderNotifications,
  body.is-mobile #btnHeaderLogout,
  body.is-mobile #headerUserSummary {
    display: none !important;
  }

  body.is-mobile .header-mobile-actions {
    display: block;
  }

  .auth-user-name {
    max-width: 140px;
  }

  .actions button {
    width: 100%;
  }

  .form-actions-sticky.actions {
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 8px;
    align-items: stretch;
  }

  .form-actions-sticky.actions button {
    align-items: center;
    display: inline-flex;
    flex: 1 1 0;
    justify-content: center;
    min-width: 0;
    overflow: hidden;
    padding-left: 8px;
    padding-right: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto;
  }

  .form-actions-sticky.actions button > span.action-btn-label,
  .form-actions-sticky.actions button > span:not(:has(svg)) {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .form-actions-sticky.actions button > span:has(svg) {
    flex-shrink: 0;
    overflow: visible;
  }

  .client-action-full {
    display: none;
  }

  .client-action-short {
    display: inline;
  }

  .form-actions-sticky.actions button > span.client-action-short {
    display: inline-block;
    max-width: 100%;
    vertical-align: bottom;
  }

  .toolbar-actions button {
    width: 100%;
  }

  .toolbar-actions.toolbar-buttons .toolbar-icon-button,
  .toolbar-actions.toolbar-buttons .toolbar-filter-toggle {
    width: auto;
    min-width: 36px;
  }

  .menu-toggle {
    width: 30px;
    min-width: 30px;
    height: 30px;
  }

  .message-content {
    align-items: center;
  }

  .cost-row {
    grid-template-columns: 1fr;
  }

  .budget-line-row {
    grid-template-columns: minmax(0, 1fr) 34px;
    align-items: end;
  }

  .budget-line-row:not(.budget-line-row-presupuesto):not(.budget-line-row-venta) .budget-line-service,
  .budget-line-row:not(.budget-line-row-presupuesto):not(.budget-line-row-venta) .budget-line-qty,
  .budget-line-row:not(.budget-line-row-presupuesto):not(.budget-line-row-venta) .budget-line-price,
  .budget-line-row:not(.budget-line-row-presupuesto):not(.budget-line-row-venta) .budget-line-discount,
  .budget-line-row:not(.budget-line-row-presupuesto):not(.budget-line-row-venta) .budget-line-subtotal,
  .budget-line-row:not(.budget-line-row-presupuesto):not(.budget-line-row-venta) .budget-line-total {
    grid-column: 1;
  }

  .budget-line-row:not(.budget-line-row-presupuesto):not(.budget-line-row-venta) .budget-remove-button {
    grid-column: 2;
    grid-row: 1;
    align-self: end;
    justify-self: end;
  }

  /* Presupuesto/venta: layout card móvil solo ≤640px; card tablet en 641–899px vía @media aparte */
  @media (max-width: 640px) {
  #vistaPresupuestoFormulario .budget-detail-header-presupuesto.budget-form-header {
    display: none;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto {
    position: relative;
    grid-template-columns: minmax(0, 1fr) minmax(0, 100px) minmax(0, 50px) minmax(0, 100px);
    grid-template-rows: auto auto auto auto;
    align-items: end;
    column-gap: 12px;
    row-gap: 12px;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-card-menu {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 3;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-card-menu .cliente-card-menu-anchor {
    position: relative;
    top: auto;
    right: auto;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-service {
    grid-column: 1 / -1;
    grid-row: 1;
    min-width: 0;
    box-sizing: border-box;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto:not(.budget-line-primera) .budget-line-service {
    padding-right: 38px;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-price {
    grid-column: 2;
    grid-row: 2;
    justify-self: stretch;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-qty {
    grid-column: 3;
    grid-row: 2;
    justify-self: stretch;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-subtotal {
    grid-column: 4;
    grid-row: 2;
    justify-self: end;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-discount {
    grid-column: 4;
    grid-row: 3;
    justify-self: end;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-total-row {
    grid-column: 4;
    grid-row: 4;
    display: block;
    justify-self: end;
    margin: 0;
    padding: 0;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-total-field {
    min-width: 0;
  }

  #listaDetallePresupuesto {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  #listaDetallePresupuesto .budget-line-row {
    margin-bottom: 0;
    padding: 14px 14px 12px;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    background: #ffffff;
    box-sizing: border-box;
  }

  #vistaVentaFormulario .budget-detail-header-venta.budget-form-header {
    display: none;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta {
    position: relative;
    grid-template-columns: minmax(0, 1fr) minmax(0, 100px) minmax(0, 50px) minmax(0, 100px);
    grid-template-rows: auto auto auto auto;
    align-items: end;
    column-gap: 12px;
    row-gap: 12px;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-card-menu {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 3;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-card-menu .cliente-card-menu-anchor {
    position: relative;
    top: auto;
    right: auto;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-service {
    grid-column: 1 / -1;
    grid-row: 1;
    min-width: 0;
    box-sizing: border-box;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta:not(.budget-line-primera) .budget-line-service {
    padding-right: 38px;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-price {
    grid-column: 2;
    grid-row: 2;
    justify-self: stretch;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-qty {
    grid-column: 3;
    grid-row: 2;
    justify-self: stretch;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-subtotal {
    grid-column: 4;
    grid-row: 2;
    justify-self: end;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-discount {
    grid-column: 4;
    grid-row: 3;
    justify-self: end;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-total-row {
    grid-column: 4;
    grid-row: 4;
    display: block;
    justify-self: end;
    margin: 0;
    padding: 0;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-total-field {
    min-width: 0;
  }
  }

  /* Líneas de servicio como cards en vista apilada (venta y gastos; presupuesto solo ≤640px arriba) */
  #listaDetalleVenta,
  #listaGastosServicio {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  #listaGastosServicio .service-cost-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    grid-template-rows: auto auto;
    gap: 12px;
    align-items: end;
    margin-bottom: 0;
    padding: 14px 14px 12px;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    background: #ffffff;
    box-sizing: border-box;
  }

  #listaGastosServicio .service-cost-row .service-cost-concept {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
  }

  #listaGastosServicio .service-cost-row .budget-remove-button {
    grid-column: 2;
    grid-row: 1;
    align-self: end;
    justify-self: end;
  }

  #listaGastosServicio .service-cost-row .service-cost-amount {
    grid-column: 1;
    grid-row: 2;
    width: 132px;
    min-width: 132px;
    max-width: 132px;
    justify-self: start;
  }

  #vistaServicioFormulario #listaGastosServicio + .toolbar-actions {
    margin-top: 20px;
  }

  #listaDetalleVenta .budget-line-row-venta {
    margin-bottom: 0;
    padding: 14px 14px 12px;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    background: #ffffff;
    box-sizing: border-box;
  }

  .budget-line-mobile-label {
    display: block;
  }

  .budget-expense-row {
    grid-template-columns: 1fr;
  }

  .budget-form-header {
    display: none;
  }

  .budget-totals {
    max-width: none;
  }

  .budget-gastos-summary {
    max-width: none;
  }

  .form-actions-sticky {
    bottom: 0;
    margin-left: -18px;
    margin-right: -18px;
    margin-bottom: 0;
    padding: 12px 18px;
  }

  .card.full-width.form-card > .form-actions-sticky {
    padding: 20px 18px 12px 18px;
  }

  .table-desktop {
    display: none;
  }

  .clientes-cards {
    display: grid;
  }

  .clinical-evaluation-modal-body .form-actions-sticky.actions {
    flex-direction: row;
    gap: 10px;
  }

  .clinical-evaluation-modal-body .form-actions-sticky.actions button {
    align-items: center;
    display: inline-flex;
    flex: 1 1 0;
    justify-content: center;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto;
  }

  .clinical-evaluation-modal-body .clinical-visit-form-actions--edit > button.secondary {
    margin-left: 0;
  }

  #empleadoConfigDialog .config-catalog-dialog-footer,
  #puestoTrabajoConfigDialog .config-catalog-dialog-footer {
    justify-content: flex-end;
  }

  #empleadoConfigDialog .config-catalog-dialog-footer button,
  #puestoTrabajoConfigDialog .config-catalog-dialog-footer button {
    flex: 0 0 auto;
    width: auto;
  }

  .clinical-action-full {
    display: none;
  }

  .clinical-action-short {
    display: inline;
  }

  .form-actions-sticky.actions button > span.clinical-action-short {
    display: inline-block;
    max-width: 100%;
    vertical-align: bottom;
  }
}

@media (max-width: 680px) {
  #vistaPresupuestoFormulario .form-actions-sticky.actions .btn-presupuesto-footer-regresar,
  #vistaVentaFormulario .form-actions-sticky.actions .btn-presupuesto-footer-regresar,
  #vistaPresupuestoFormulario .form-actions-sticky.actions .btn-presupuesto-compartir-footer {
    flex: 0 0 auto;
    width: 42px;
    min-width: 42px;
    max-width: 42px;
    height: 42px;
    padding: 0;
    box-sizing: border-box;
  }

  #vistaPresupuestoFormulario .form-actions-sticky.actions .btn-presupuesto-footer-regresar,
  #vistaVentaFormulario .form-actions-sticky.actions .btn-presupuesto-footer-regresar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  #vistaPresupuestoFormulario .form-actions-sticky.actions .btn-presupuesto-footer-regresar .btn-presupuesto-footer-regresar__label-desktop,
  #vistaVentaFormulario .form-actions-sticky.actions .btn-presupuesto-footer-regresar .btn-presupuesto-footer-regresar__label-desktop {
    display: none;
  }

  #vistaPresupuestoFormulario .form-actions-sticky.actions .btn-presupuesto-footer-regresar .btn-presupuesto-footer-regresar__label-mobile,
  #vistaVentaFormulario .form-actions-sticky.actions .btn-presupuesto-footer-regresar .btn-presupuesto-footer-regresar__label-mobile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  #vistaPresupuestoFormulario .form-actions-sticky.actions .btn-presupuesto-footer-regresar .btn-presupuesto-footer-regresar__label-mobile svg,
  #vistaVentaFormulario .form-actions-sticky.actions .btn-presupuesto-footer-regresar .btn-presupuesto-footer-regresar__label-mobile svg {
    width: 22px;
    height: 22px;
    display: block;
    fill: currentColor;
  }

  #vistaPresupuestoFormulario .form-actions-sticky.actions .btn-presupuesto-compartir-footer {
    gap: 0;
  }

  #vistaPresupuestoFormulario .form-actions-sticky.actions .btn-presupuesto-compartir-footer .btn-presupuesto-compartir-footer__txt {
    display: none;
  }

  #vistaPresupuestoFormulario .form-actions-sticky.actions .btn-presupuesto-compartir-footer .btn-presupuesto-compartir-footer__ico svg {
    width: 22px;
    height: 22px;
  }
}

/* Presupuesto/venta en card (≤899px): campos monetarios hasta 100px, encogibles; solo servicio es flexible */
@media (max-width: 899px) {
  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-price,
  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-subtotal,
  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-discount,
  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-price,
  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-subtotal,
  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-discount {
    width: 100%;
    min-width: 0;
    max-width: 100px;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-total-row,
  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-total-row {
    width: 100%;
    min-width: 0;
    max-width: 100px;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-total-field,
  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-total-field {
    width: 100%;
    min-width: 0;
    max-width: 100px;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-qty,
  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-qty {
    width: 100%;
    min-width: 0;
    max-width: 50px;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-price .money-input-wrapper,
  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-subtotal .money-input-wrapper,
  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-discount .money-input-wrapper,
  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-total-field .money-input-wrapper,
  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-price .money-input-wrapper,
  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-subtotal .money-input-wrapper,
  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-discount .money-input-wrapper,
  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-total-field .money-input-wrapper {
    min-width: 0;
    width: 100%;
    max-width: 100%;
  }
}

/* Presupuesto/venta: card tablet 641–899px (fila 1: servicio|Punit|Cant|Ptotal; filas 2–3: Dsct/P.Total col. derecha) */
@media (min-width: 641px) and (max-width: 899px) {
  #vistaPresupuestoFormulario .budget-detail-header-presupuesto.budget-form-header {
    display: none;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto {
    position: relative;
    grid-template-columns: minmax(0, 1fr) minmax(0, 100px) minmax(0, 50px) minmax(0, 100px);
    grid-template-rows: auto auto auto;
    align-items: end;
    column-gap: 12px;
    row-gap: 12px;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-card-menu {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 3;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-card-menu .cliente-card-menu-anchor {
    position: relative;
    top: auto;
    right: auto;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-service {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    box-sizing: border-box;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto:not(.budget-line-primera) .budget-line-service {
    padding-right: 38px;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-price {
    grid-column: 2;
    grid-row: 1;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-qty {
    grid-column: 3;
    grid-row: 1;
    justify-self: stretch;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-subtotal {
    grid-column: 4;
    grid-row: 1;
    justify-self: end;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-discount {
    grid-column: 4;
    grid-row: 2;
    justify-self: end;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-total-row {
    grid-column: 4;
    grid-row: 3;
    display: block;
    justify-self: end;
    margin: 0;
    padding: 0;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-total-field {
    min-width: 0;
  }

  #listaDetallePresupuesto {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  #listaDetallePresupuesto .budget-line-row {
    margin-bottom: 0;
    padding: 14px 14px 12px;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    background: #ffffff;
    box-sizing: border-box;
  }

  #listaDetallePresupuesto .budget-line-mobile-label {
    display: block;
  }

  #vistaVentaFormulario .budget-detail-header-venta.budget-form-header {
    display: none;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta {
    position: relative;
    grid-template-columns: minmax(0, 1fr) minmax(0, 100px) minmax(0, 50px) minmax(0, 100px);
    grid-template-rows: auto auto auto;
    align-items: end;
    column-gap: 12px;
    row-gap: 12px;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-card-menu {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 3;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-card-menu .cliente-card-menu-anchor {
    position: relative;
    top: auto;
    right: auto;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-service {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    box-sizing: border-box;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta:not(.budget-line-primera) .budget-line-service {
    padding-right: 38px;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-price {
    grid-column: 2;
    grid-row: 1;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-qty {
    grid-column: 3;
    grid-row: 1;
    justify-self: stretch;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-subtotal {
    grid-column: 4;
    grid-row: 1;
    justify-self: end;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-discount {
    grid-column: 4;
    grid-row: 2;
    justify-self: end;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-total-row {
    grid-column: 4;
    grid-row: 3;
    display: block;
    justify-self: end;
    margin: 0;
    padding: 0;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-total-field {
    min-width: 0;
  }

  #listaDetalleVenta {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  #listaDetalleVenta .budget-line-row-venta {
    margin-bottom: 0;
    padding: 14px 14px 12px;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    background: #ffffff;
    box-sizing: border-box;
  }

  #listaDetalleVenta .budget-line-row-venta .budget-line-mobile-label {
    display: block;
  }
}

/* Presupuesto/venta: rejilla horizontal de líneas solo desde 900px */
@media (min-width: 900px) {
  #vistaPresupuestoFormulario .budget-detail-header-presupuesto.budget-form-header {
    display: grid;
  }

  /* Servicio + 4 importes comparten el encogimiento (fr); cada importe cap 120px via min(120px, 1fr). */
  #vistaPresupuestoFormulario .budget-detail-header-presupuesto {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    grid-template-columns: minmax(100px, 2.4fr) minmax(88px, min(120px, 1fr)) minmax(46px, 50px) minmax(88px, min(120px, 1fr)) minmax(88px, min(120px, 1fr)) minmax(88px, min(120px, 1fr)) 34px;
  }

  #vistaPresupuestoFormulario .budget-detail-header-presupuesto > div:nth-child(6) {
    text-align: right;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    grid-template-columns: minmax(100px, 2.4fr) minmax(88px, min(120px, 1fr)) minmax(46px, 50px) minmax(88px, min(120px, 1fr)) minmax(88px, min(120px, 1fr)) minmax(88px, min(120px, 1fr)) 34px;
    grid-template-rows: auto;
    align-items: end;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto > .budget-line-service {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto > .budget-line-price {
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto > .budget-line-qty {
    grid-column: 3;
    grid-row: 1;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto > .budget-line-subtotal {
    grid-column: 4;
    grid-row: 1;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto > .budget-line-discount {
    grid-column: 5;
    grid-row: 1;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto > .budget-line-total-row {
    grid-column: 6;
    grid-row: 1;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    padding: 0;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto > .budget-line-card-menu {
    grid-column: 7;
    grid-row: 1;
    align-self: end;
    justify-self: end;
  }

  #vistaPresupuestoFormulario #listaDetallePresupuesto .budget-line-row-presupuesto .budget-line-total-field {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  #listaDetallePresupuesto {
    display: block;
    gap: 0;
    min-width: 0;
    width: 100%;
    max-width: 100%;
  }

  #listaDetallePresupuesto .budget-line-row {
    margin-bottom: 12px;
    padding: 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
  }

  #listaDetallePresupuesto .budget-line-mobile-label {
    display: none;
  }

  #vistaVentaFormulario .budget-detail-header-venta.budget-form-header {
    display: grid;
  }

  #vistaVentaFormulario .budget-detail-header-venta {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    grid-template-columns: minmax(100px, 2.4fr) minmax(88px, min(120px, 1fr)) minmax(46px, 50px) minmax(88px, min(120px, 1fr)) minmax(88px, min(120px, 1fr)) minmax(88px, min(120px, 1fr)) 34px;
  }

  #vistaVentaFormulario .budget-detail-header-venta > div:nth-child(6) {
    text-align: right;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    grid-template-columns: minmax(100px, 2.4fr) minmax(88px, min(120px, 1fr)) minmax(46px, 50px) minmax(88px, min(120px, 1fr)) minmax(88px, min(120px, 1fr)) minmax(88px, min(120px, 1fr)) 34px;
    grid-template-rows: auto;
    align-items: end;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta > .budget-line-service {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta > .budget-line-price {
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta > .budget-line-qty {
    grid-column: 3;
    grid-row: 1;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta > .budget-line-subtotal {
    grid-column: 4;
    grid-row: 1;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta > .budget-line-discount {
    grid-column: 5;
    grid-row: 1;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta > .budget-line-total-row {
    grid-column: 6;
    grid-row: 1;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    padding: 0;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta > .budget-line-card-menu {
    grid-column: 7;
    grid-row: 1;
    align-self: end;
    justify-self: end;
  }

  #vistaVentaFormulario #listaDetalleVenta .budget-line-row-venta .budget-line-total-field {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  #listaDetalleVenta {
    display: block;
    gap: 0;
    min-width: 0;
    width: 100%;
    max-width: 100%;
  }

  #listaDetalleVenta .budget-line-row-venta {
    margin-bottom: 12px;
    padding: 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
  }

  #listaDetalleVenta .budget-line-row-venta .budget-line-mobile-label {
    display: none;
  }
}

@media (min-width: 900px) {
  #listaDetalleVenta,
  #listaGastosServicio {
    display: block;
    gap: 0;
  }

  #listaGastosServicio .service-cost-row {
    margin-bottom: 12px;
    padding: 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
  }
}

@media (max-width: 1024px) {
  .dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-widget-small,
  .dashboard-widget-medium,
  .dashboard-widget-large {
    grid-column: span 1;
  }

  .dashboard-builder-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .dashboard-actions {
    justify-content: flex-start;
  }

  .dashboard-quick-actions {
    gap: 8px;
    flex-wrap: nowrap;
  }

  .dashboard-home-footer {
    padding-left: 12px;
    padding-right: 12px;
  }

  .dashboard-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-widget-small,
  .dashboard-widget-medium,
  .dashboard-widget-large {
    grid-column: span 1;
  }

  .dashboard-chart-summary {
    grid-template-columns: 1fr;
  }

  .dashboard-builder-item {
    grid-template-columns: 1fr;
  }

  .dashboard-drag-handle {
    display: none;
  }

  .dashboard-builder-actions {
    justify-content: flex-start;
  }
}

#btnHeaderVoice {
  position: relative;
  overflow: visible;
}

#btnHeaderVoice,
#btnHeaderVoice:hover {
  background: transparent;
}

#btnHeaderVoice.is-listening {
  color: #dc2626;
}

#btnHeaderVoice.is-listening svg {
  fill: #dc2626;
}

.voice-command-pulse {
  position: absolute;
  inset: 0;
  border-radius: 8px;
  border: 2px solid transparent;
  pointer-events: none;
  opacity: 0;
}

#btnHeaderVoice.is-listening .voice-command-pulse {
  opacity: 1;
  border-color: #dc2626;
  animation: voice-pulse 1.4s ease-out infinite;
}

@keyframes voice-pulse {
  0% {
    transform: scale(1);
    opacity: 0.85;
  }
  100% {
    transform: scale(1.45);
    opacity: 0;
  }
}

#voiceCommandDialog .dialog {
  box-sizing: border-box;
  width: 100%;
  max-width: min(960px, calc(100vw - 32px));
  max-height: min(86vh, 760px);
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 0;
  /* Sin esto, el hijo con flex-basis 0 puede colapsar a ~0 cuando la altura del modal es “intrínseca”. */
  overflow: hidden;
}

#voiceCommandDialog .voice-dialog-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 20px 12px;
  border-bottom: 1px solid #e5e7eb;
  flex-shrink: 0;
}

#voiceCommandDialog .voice-dialog-header h3 {
  margin: 0;
  font-size: 18px;
  color: #111827;
}

#voiceCommandDialog .voice-dialog-title-with-dots {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0;
}

#voiceCommandDialog .voice-dialog-title-dots.visita-home-loading {
  margin-left: 2px;
}

/* Mismo micrófono rojo con pulso que #btnHeaderVoice.is-listening, junto al título "Escuchando…". */
#voiceCommandDialog .voice-dialog-title-mic {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin-left: 8px;
  flex-shrink: 0;
  color: #dc2626;
  overflow: visible;
}

#voiceCommandDialog .voice-dialog-title-mic .voice-command-pulse {
  border-radius: 8px;
}

#voiceCommandDialog .voice-dialog-title-mic svg {
  width: 22px;
  height: 22px;
  fill: currentColor;
}

#voiceCommandDialog .voice-dialog-title-mic:not(.is-hidden) .voice-command-pulse {
  opacity: 1;
  border-color: #dc2626;
  animation: voice-pulse 1.4s ease-out infinite;
}

#voiceCommandDialog .voice-dialog-title-mic.is-hidden {
  display: none !important;
}

#voiceCommandDialog .voice-dialog-title-dots.is-hidden {
  display: none !important;
}

#voiceCommandDialog .voice-field-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin: 0;
}

#voiceCommandDialog .voice-field-label-row > label {
  margin: 0;
  flex: 1;
  min-width: 0;
  font-size: 12px;
}

#voiceCommandDialog .voice-pendiente-pill {
  flex-shrink: 0;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 3px 8px;
  border-radius: 999px;
  background: #fecaca;
  color: #991b1b;
  border: none;
  line-height: 1.2;
  margin-bottom:2px;
}

#voiceCommandDialog .voice-pendiente-pill.is-hidden {
  display: none !important;
}

#voiceCommandDialog .voice-dialog-body {
  box-sizing: border-box;
  /* 1 1 0 dejaba altura ~0 con min-height:0 + overflow:auto y padre sin altura fija (solo max-height). */
  flex: 1 1 auto;
  min-height: 0;
  padding: 14px 20px 16px;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

#voiceCommandDialog .voice-dialog-layout {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: stretch;
  min-height: 0;
}

#voiceCommandDialog .voice-dialog-col-transcript {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  align-self: start;
  gap: 6px;
  width:100%
}

#voiceCommandDialog .voice-dialog-footer.is-hidden {
  display: none;
}

#voiceCommandDialog #voiceAccionRow.is-hidden,
#voiceCommandDialog .voice-accion-row.is-hidden {
  display: none !important;
}

#voiceCommandFields .field {
  margin-bottom: 10px;
}

#voiceCommandDialog .voice-dialog-col-form {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#voiceCommandDialog .voice-dialog-listen-hint,
#voiceCommandDialog .voice-dialog-processing-hint {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: #4b5563;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0;
}

#voiceCommandDialog .voice-dialog-processing-hint .visita-home-loading {
  margin-left: 2px;
}

#voiceCommandDialog .voice-dialog-listen-hint.is-hidden,
#voiceCommandDialog .voice-dialog-processing-hint.is-hidden,
#voiceCommandDialog .voice-dialog-error-wrap.is-hidden,
#voiceCommandDialog .voice-combos-processing-bar.is-hidden {
  display: none;
}

#voiceCommandDialog .voice-dialog-error-wrap {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#voiceCommandDialog .voice-dialog-retry-actions {
  margin-top: 0;
  justify-content: flex-start;
}

#voiceCommandDialog .voice-dialog-error {
  margin: 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #b91c1c;
  font-size: 13px;
  line-height: 1.45;
  font-weight: 600;
}

#voiceCommandDialog .voice-transcript-block {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  background: #f3f4f6;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 8px 12px 10px;
  margin: 0;
  color: #374151;
  font-size: 13px;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
  min-height: 0;
}

#voiceCommandDialog .voice-transcript-label {
  display: block;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #6b7280;
  margin: 0;
  line-height: 1.3;
}

#voiceCommandDialog #voiceTranscript {
  margin: 0;
  align-self: flex-start;
  width: 100%;
}

#voiceCommandDialog .voice-fields {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

#voiceCommandDialog .voice-combos-processing-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  font-size: 13px;
  color: #475569;
  line-height: 1.35;
}

#voiceCommandDialog .voice-combos-processing-spinner {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border: 2px solid #cbd5e1;
  border-top-color: #2563eb;
  border-radius: 50%;
  animation: girar 0.75s linear infinite;
}

#voiceCommandDialog .voice-combos-processing-text {
  flex: 1;
  min-width: 0;
}

#voiceCommandDialog .field.voice-accion-row .combo-select {
  width: 100%;
}

/* Misma separación label/control que Acción: gap en .field en lugar de margin del label global */
#voiceCommandDialog .field {
  gap: 6px;
}

/* Misma jerarquía tipográfica que registro de clientes (.field + #panelDatosCliente .field > label) */
#voiceCommandDialog .field > label {
  margin-bottom: 0;
  font-size: 12px;
}

#voiceCommandDialog .field input,
#voiceCommandDialog .field select {
  width: 100%;
  box-sizing: border-box;
}

#voiceCommandDialog .voice-dialog-footer {
  flex-shrink: 0;
  padding: 14px 20px 18px;
  border-top: 1px solid #e5e7eb;
}

#voiceCommandDialog .voice-dialog-footer .actions {
  margin-top: 0;
  justify-content: flex-end;
}

#voiceCommandDialog .voice-empty-state {
  color: #6b7280;
  font-size: 13px;
  font-style: italic;
}

@media (min-width: 641px) {
  #voiceCommandDialog .voice-dialog-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.42fr) minmax(0, 0.58fr);
    gap: 20px;
    align-items: stretch;
  }

  #voiceCommandDialog .voice-dialog-col-transcript {
    min-height: 0;
    align-self: stretch;
  }

  #voiceCommandDialog .voice-transcript-block {
    min-height: 0;
    overflow-y: auto;
  }

  #voiceCommandDialog .voice-dialog-col-form {
    min-height: 0;
  }
}

@media (max-width: 640px) {
  #voiceCommandDialog .dialog {
    width: 100%;
    max-height: 92vh;
    border-radius: 12px;
  }

  #voiceCommandDialog .grid {
    grid-template-columns: 1fr;
  }
}

/* Controles altos — radio 14px (altura > 35px) */
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea,
.combo-select-input,
.actions button,
.form-actions-sticky.actions button,
.form-actions-sticky button,
.toolbar-actions button,
.toolbar-buttons .toolbar-filter-toggle,
.menu button:not(.menu-version),
.menu button.menu-logo,
.dashboard-quick-action,
#toolbarPeriodoCitas .btn-calendario-citas-toggle,
.toolbar-search .field.full input[type="text"],
.config-multi-combo-trigger,
.eecc-conciliar-btn,
.card-action-button,
.presupuesto-share-url-buttons.actions button,
#vistaPresupuestoFormulario .btn-presupuesto-compartir-footer,
#vistaConsentimientoInformadoFormulario .btn-presupuesto-compartir-footer,
.btn-nuevo-listado-mobile-footer {
  border-radius: var(--control-radius);
}