/* ==========================================================================
   app.css — Portal DIS · Estilos Globales
   --------------------------------------------------------------------------
   Limpieza y reorganización 2025-11:
   - Mantiene TODAS las clases funcionales (panel, fotos, badges, modales…)
   - Reduce redundancias (btn*, input*, badge*)
   - Orden lógico por módulos
   ========================================================================== */

/* === BASE === */
html, body {
  height: 100%;
  overflow: hidden;
}
body {
  color: var(--dis-gray-900);
  background: var(--dis-gray-50);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
a { color: var(--dis-gray-700); text-decoration: none; }
a:hover { color: var(--dis-gray-900); text-decoration: underline; }
:focus-visible { outline: 2px solid var(--dis-focus); outline-offset: 2px; }
.btn:focus-visible, .form-control:focus, .form-select:focus {
  box-shadow: 0 0 0 .2rem rgba(108,117,125,.35)!important;
  border-color: var(--dis-gray-600);
}

/* === LAYOUT === */
.container-fluid { padding: 0; }
.app-shell { height: calc(100vh - var(--dis-navbar-h) - var(--dis-bc-h)); padding: 0!important; }
.app-shell > .row { --bs-gutter-x: 0; height: 100%; align-items: stretch; }

main, .dis-main {
  height: 100%; overflow-y: scroll; overscroll-behavior: contain; scrollbar-gutter: stable;
}
main::-webkit-scrollbar { width: 12px; }
main::-webkit-scrollbar-thumb { background: var(--dis-gray-400); border-radius: 8px; }
main::-webkit-scrollbar-thumb:hover { background: var(--dis-gray-500); }
main::-webkit-scrollbar-track { background: var(--dis-gray-200); }

/* === NAVBAR === */
.navbar {
  background: var(--dis-gray-800)!important;
  color: #fff!important;
  min-height: var(--dis-navbar-h);
  padding-left: 12px;
  z-index: 1040!important;
}
.navbar a { color: #fff!important; }
.navbar .nav-link:hover { opacity: .9; }
.dropdown-menu { background: var(--dis-gray-800); z-index: 1060!important; }
.dropdown-item { color: rgba(255,255,255,.9); }
.dropdown-item:hover { background: var(--dis-gray-700); }
.dropdown-item.active,
.dropdown-item:active { background-color: var(--dis-success); color: #fff; }

/* === BREADCRUMB === */
.breadcrumb-bar {
  background: var(--dis-gray-900);
  height: var(--dis-bc-h);
  position: sticky;
  top: var(--dis-navbar-h);
  z-index: 1020!important;
  display: flex;
  align-items: center;
}
.dis-breadcrumb {
  --bs-breadcrumb-divider: '>'!important;
  padding: .2rem .75rem;
  font-size: .81rem;
  background: transparent;
  border: 0;
  margin-bottom: 0;
}
.breadcrumb .breadcrumb-item a { color: rgba(255,255,255,.85); }
.breadcrumb .breadcrumb-item.active { color: var(--dis-green-300); font-weight: 600; }

/* === PANEL LATERAL === */
[data-panel] {
  width: 280px;
  background: var(--dis-gray-600);
  border-right: 1px solid var(--dis-gray-700);
}
@media (min-width: 992px) {
  [data-panel] { position: sticky; top: 0; height: 100dvh; }
}
[data-panel] .nav-link {
  color: rgba(255,255,255,.85);
  padding: .5rem .75rem;
  border-radius: .5rem;
  transition: background-color .15s, color .15s;
}
[data-panel] .nav-link:hover { background: var(--dis-gray-300); color: #505050; }
[data-panel] .nav-link.active {
  background: var(--dis-gray-800);
  color: var(--dis-green-300)!important;
  font-weight: 600;
  box-shadow: inset 3px 0 0 var(--dis-success-hover);
}
[data-panel] .panel-wrap {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 100dvh;
}
[data-panel] .panel-head {
  flex: 0 0 auto;
  padding: .2rem .75rem .3rem;
}
[data-panel] .panel-scroll {
  flex: 1 1 auto;
  overflow-y: auto;
  min-height: 0;
  padding: 0 .75rem 2.5rem;
}
[data-panel] .nav-filter {
  margin-bottom: .35rem;
}
[data-panel] .nav-filter-wrap {
  position: relative;
}
[data-panel] .nav-filter-input {
  background: rgba(255,255,255,.85);
  border: 1px solid var(--dis-gray-300);
  color: #000;
  caret-color: #000;
  padding-right: 2rem;
}
[data-panel] .nav-filter-input::-webkit-search-cancel-button {
  -webkit-appearance: none;
}
[data-panel] .nav-filter-input::placeholder {
  color: #6b6b6b;
}
[data-panel] .nav-filter-input:focus {
  background: rgba(255,255,255,.95);
  border-color: var(--dis-gray-500);
  box-shadow: none;
  color: #000;
}
[data-panel] .nav-filter-clear {
  position: absolute;
  right: .35rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.5rem;
  height: 1.5rem;
  border: 0;
  background: transparent;
  color: #2b2b2b;
  border-radius: .35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
[data-panel] .nav-filter-clear:hover {
  background: rgba(0,0,0,.08);
  color: #111;
}
[data-panel] .nav-filter-clear:focus {
  outline: none;
  box-shadow: 0 0 0 .1rem rgba(0,0,0,.2);
}
[data-panel] .panel-version {
  flex: 0 0 auto;
  position: sticky;
  bottom: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .5rem .75rem;
  font-size: .75rem;
  color: rgba(255,255,255,.6);
  border-top: 1px solid var(--dis-gray-700);
  background: #15191f;
}
[data-panel] .panel-version-value {
  font-variant-numeric: tabular-nums;
}
[data-panel] .nav-group {
  margin: 0;
}
[data-panel] .nav-group > summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: .5rem;
}
[data-panel] .nav-group > summary.nav-link {
  color: var(--dis-green-300);
}
[data-panel] .nav-group > summary.nav-link:hover {
  background: rgba(223, 255, 239, .45);
  color: var(--dis-green-900) !important;
}
[data-panel] .nav-group[open] > summary.nav-link {
  color: var(--dis-green-400);
}
[data-panel] .nav-group > summary::-webkit-details-marker {
  display: none;
}
[data-panel] .nav-group-caret {
  font-size: .9rem;
  transition: transform .15s;
}
[data-panel] .nav-group[open] .nav-group-caret {
  transform: rotate(90deg);
}
[data-panel] .nav-group-items {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  padding-left: 1.25rem;
}

/* === CARDS === */
.card { background: #fff; border-color: var(--dis-gray-200); }
.card-filter {
  display: flex;
  align-items: center;
  gap: .5rem;
  background: var(--dis-blue-100);
  border: 1px solid var(--dis-blue-300);
  border-radius: .5rem;
  padding: 5px 10px;
  font-size: .8rem;
  color: #667382;
}
.api-card-header {
  min-height: var(--dis-card-header-min-h, 3rem);
  padding: var(--dis-card-header-py, .75rem) var(--dis-card-header-px, 1rem);
  margin: 0;
}
.api-card-header .api-header-actions {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: var(--dis-card-header-actions-gap, .65rem);
  padding-left: var(--dis-card-header-actions-pl, .5rem);
  flex-wrap: wrap;
  row-gap: .35rem;
}
.api-card-header .api-header-actions > *,
.api-card-header .api-header-actions .form-check,
.api-card-header .api-header-actions .btn-group {
  margin-bottom: 0;
}

/* === TABLAS === */
.table th { 
  color: var(--dis-gray-700); 
  border-bottom: 2px solid var(--dis-gray-300); 
}
.table tbody tr:hover { background: var(--dis-gray-100); }
.table td small { font-size: .8rem; }
.table .badge { 
  font-size: .72rem;
  line-height: 1;
  vertical-align: middle; 
}
.table .badge.badge-gray {
  background: var(--dis-gray-200);
  color: var(--dis-gray-700);
}
.table a.text-blue-strong:hover { 
  text-decoration: underline; 
}
.table .btn-group-sm .btn,
.table .btn.btn-sm {
  padding: .25rem .55rem;
  line-height: 1.1;
  min-height: 1.75rem;
  font-size: .78rem;
}
.table .btn-group-sm {
  gap: .25rem;
  align-items: center;
}
.table td .btn,
.table td .btn-group {
  vertical-align: middle;
}
.table .btn-group.gap-1 > .btn {
  min-width: 25px;
  padding-left: .4rem;
  padding-right: .4rem;
}
.table .btn-group.gap-1 {
  gap: .25rem;
}
.table .period-col {
  width: 78px;
}
.table td .btn-group .btn .ti {
  font-size: 1rem;
  vertical-align: middle;
  line-height: 1;
}
.table td .btn-group .btn.btn-sm .ti {
  margin-top: -1px;
}
.table td .btn-group .btn-outline-danger .ti {
  font-size: 1.05rem;
}

/* === FORMULARIOS === */
.form-control, .form-select {
  border-color: var(--dis-gray-300);
  background: #fff;
}
.input-new { background: var(--dis-blue-100)!important; border-color: #cfe3ff!important; }
.input-edit { background: var(--dis-green-50)!important; border-color: var(--dis-green-200)!important; }
.input-new:focus, .input-edit:focus {
  background: var(--dis-yellow-50)!important;
  border-color: var(--dis-yellow-100)!important;
  outline: 2px solid var(--dis-yellow-90);
}
.input-group-text { background: var(--dis-gray-100); border-color: var(--dis-gray-300); }
.row-handle-btn {
  cursor: grab;
  color: var(--dis-gray-500);
  touch-action: none;
  user-select: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 6px;
  border: 0;
  background: transparent;
}
.row-handle-btn:disabled { cursor: default; }
.row-handle-icon { pointer-events: none; }
.row-item, .row-item * { -webkit-user-drag: none; }
.row-handle-btn:active { cursor: grabbing; }
tr.dragging { opacity: 0.6; }
tr.dragging td {
  background: var(--dis-yellow-50) !important;
  box-shadow: inset 0 0 0 1px var(--dis-yellow-200);
}
.row-drop-before td { border-top: 2px dashed var(--dis-blue-400); }
.row-drop-after td { border-bottom: 2px dashed var(--dis-blue-400); }
body.drag-active, body.drag-active * {
  cursor: grabbing !important;
  user-select: none !important;
}
.row-actions {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 30px;
  gap: 6px;
  justify-content: start;
  align-items: center;
}
.row-actions-cell {
  text-align: left !important;
}
.row-actions-cell .row-actions {
  width: 100%;
}
.row-actions .btn {
  width: 30px;
  height: 28px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.row-comment-btn.has-comment {
  background: var(--dis-yellow-80);
  border-color: var(--dis-yellow-300);
  color: var(--dis-yellow-900);
}
.row-comment-btn.has-comment:hover {
  background: var(--dis-yellow-100);
}
tr.row-path-group td {
  background: var(--dis-yellow-50);
  border-top: 1px solid var(--dis-yellow-200);
  color: var(--dis-yellow-800);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 6px 10px;
}
tr.row-path-group td.row-actions-cell {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.row-path-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 8px;
  background: var(--dis-yellow-0);
  border: 1px solid var(--dis-yellow-200);
  border-radius: 999px;
}
.row-path-count {
  display: inline-flex;
  align-items: center;
  padding: 2px 7px;
  margin-left: 6px;
  background: var(--dis-blue-800);
  border: 1px solid var(--dis-blue-900);
  border-radius: 999px;
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1;
}

/* === BOTONES === */
.btn-primary, .btn-success {
  background-color: var(--dis-success)!important;
  border-color: var(--dis-success)!important;
  color: #fff!important;
  transition: background-color .15s, border-color .15s, box-shadow .15s;
}
.btn-primary:hover, .btn-success:hover {
  background-color: var(--dis-success-hover)!important;
  border-color: var(--dis-success-hover)!important;
}
.btn-secondary {
  background: var(--dis-gray-500)!important;
  border-color: var(--dis-gray-500)!important;
  color: #fff!important;
}

/* === ALERTAS === */
.alert { border-radius: .5rem; }
.alert-warning {
  background: var(--dis-yellow-80)!important;
  border: 1px solid var(--dis-yellow-300)!important;
  color: var(--dis-yellow-800)!important;
}

/* === ACCORDIONS === */
.acc-header-grp {
  background: var(--dis-blue-100);
  padding: var(--dis-card-header-py, .75rem) var(--dis-card-header-px, 1rem);
  border-bottom: 1px solid rgba(0,0,0,.06);
  display: flex;
  align-items: center;
  gap: .5rem;
  min-height: var(--dis-card-header-min-h, 3rem);
}
.acc-header-grp .card-title { font-size: .95rem; font-weight: 600; }
.acc-caret { height: 1.25rem; width: 1.25rem; display: inline-flex; align-items: center; justify-content: center; }

/* === BADGES === */
.badge {
  border-radius: .5rem;
  font-weight: 600;
  padding: .25rem .5rem;
}
.badge-upper {
  border-radius: .5rem;
  font-weight: 600;
  padding: .25rem .5rem;
  text-transform: uppercase;
}
.badge-count { 
  background: var(--dis-blue-800); 
  color: #fff; 
  font-weight: 700; 
}
.badge-blue {
  background: var(--dis-blue-200);
  color: var(--dis-blue-900);
  border: 1px solid var(--dis-blue-400);
}
.badge-sky {
  background: #dff6ff;
  color: #0b5f78;
  border: 1px solid #7dd3fc;
}
.badge-green {
  background: var(--dis-green-200);
  color: var(--dis-green-900);
  border: 1px solid var(--dis-green-400);
}
.badge-lime {
  background: #dcf7b8;
  color: #355b00;
  border: 1px solid #9bd24a;
}
.badge-violet {
  background: #e9ddff;
  color: #5b21b6;
  border: 1px solid #a78bfa;
}
.badge-fuchsia {
  background: #ffd9ef;
  color: #a21caf;
  border: 1px solid #f472b6;
}
.table .badge.badge-violet {
  background: #e9ddff;
  color: #5b21b6;
  border: 1px solid #a78bfa;
}
.table .badge.badge-sky {
  background: #dff6ff;
  color: #0b5f78;
  border: 1px solid #7dd3fc;
}
.table .badge.badge-fuchsia {
  background: #ffd9ef;
  color: #a21caf;
  border: 1px solid #f472b6;
}
.badge-gray {
  background: var(--dis-gray-200);
  color: var(--dis-gray-900);
  border: 1px solid var(--dis-gray-400);
}
.badge-orange {
  background: var(--dis-orange-200);
  color: var(--dis-orange-900);
  border: 1px solid var(--dis-orange-400);
}
.badge-red { 
  background: var(--dis-red-200);
  color: var(--dis-red-900);
  border: 1px solid var(--dis-red-400);
 }
.badge-yellow { 
  background: var(--dis-yellow-200); 
  color: var(--dis-yellow-900);
  border: 1px solid var(--dis-yellow-400);
 }

/* === LISTAS COMPACTAS === */
.list-group-compact .list-group-item {
  border-radius: .5rem;
  padding: .5rem .9rem;
}
.list-group-compact .list-group-item:hover {
  border-left: 3px solid var(--dis-blue-600);
  background: var(--dis-blue-100);
  color: var(--dis-blue-800);
}
.list-group-compact .list-group-item.active {
  border-left: 3px solid var(--dis-success-hover);
  background: var(--dis-green-100);
  color: var(--dis-green-800);
}
.list-group-compact .avatar.avatar-sm { width: 40px; height: 40px; }

/* === FOTOS === */
.photo-wrapper { position: relative; display: inline-block; cursor: pointer; }
.photo-wrapper .avatar { width: 64px; height: 64px; }
.photo-overlay {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.25); color: #fff;
  border-radius: 50%; opacity: 0;
  transition: opacity .15s;
}
.photo-wrapper:hover .photo-overlay { opacity: 1; }
.photo-overlay .ti { font-size: 1.25rem; }

/* === CÓDIGO === */
pre {
  color: var(--dis-gray-900);
  background: var(--dis-gray-300);
  border: 1px solid var(--dis-gray-400);
  border-radius: .375rem;
}
code {
  background: var(--dis-gray-100);
  border: 0px solid var(--dis-gray-200);
  border-radius: .375rem;
}

/* === DOCUMENTOS (CRUD + VISOR) === */
#docModal .modal-header { background: var(--dis-blue-50); border-bottom: 1px solid var(--dis-gray-200); }
#docModal .modal-footer { border-top: 1px solid var(--dis-gray-200); background: var(--dis-gray-50); }
#flt-form .col-auto,
#flt-form .form-select-sm,
#flt-form .form-control-sm {
  margin-right: .25rem;
}
#payload-panel { max-height: 400px; overflow: auto; background: #fdfdfd; }
#payload_in {
  background: #fafafa; font-family: monospace; font-size: .85rem;
  line-height: 1.4; border: 0; resize: vertical;
}
#payload_in:focus { background: #fffceb; outline: 2px solid var(--dis-yellow-100); }

/* === Document download tiles === */
.download-tiles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.download-tile {
  aspect-ratio: 1 / 1;
  min-height: 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 0.35rem;
  border: 2px solid #d1d5db;
  border-radius: 14px;
  text-decoration: none;
  color: #374151;
  background: #ffffff;
  font-weight: 700;
  font-size: 1.2rem;
  transition: transform 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.download-tile:hover,
.download-tile:focus {
  border-color: #6ea8fe;
  color: #1d4ed8;
  transform: translateY(-1px);
}

.download-tile.disabled,
.download-tile[aria-disabled="true"] {
  opacity: 0.5;
  pointer-events: none;
  transform: none;
}

.download-tile-label {
  font-size: 1.25rem;
  letter-spacing: 0.08em;
}

.download-tile-icon {
  font-size: 2.1rem;
  line-height: 1;
}
#payload-alert {
  border: 1px solid var(--dis-orange-300);
  background: var(--dis-orange-70);
  color: var(--dis-orange-900);
  border-radius: .375rem;
}
#sysModal .form-control:disabled,
#sysModal .form-select:disabled,
#sysModal .form-control[readonly] {
  background: var(--dis-gray-100) !important;
  color: var(--dis-gray-700) !important;
}
#viewerModal .modal-header {
  background: var(--dis-gray-100);
  border-bottom: 1px solid var(--dis-gray-300);
}
#viewerModal .modal-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--dis-gray-900);
}
#viewerModal #viewer-field-name {
  color: var(--dis-gray-600);
  font-weight: 500;
}
#viewerModal .badge.bg-primary {
  background-color: var(--dis-blue-700) !important;
  color: #fff !important;
}
#viewerModal .syntax-light {
  background: var(--dis-gray-50);
  font-family: monospace;
  font-size: .85rem;
  border-radius: .5rem;
  white-space: pre-wrap;
  word-break: break-word;
  color: var(--dis-gray-900);
}
#viewerModal:focus,
#viewerModal:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}
#viewerModal .btn-close:focus,
#viewerModal .btn-close:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}
#viewerModal .btn:focus-visible {
  box-shadow: 0 0 0 .15rem rgba(0,0,0,.15);
}
#viewer-content {
  font-family: monospace;
  white-space: pre-wrap;
  word-break: break-word;
  background: var(--dis-gray-50);
  border: 1px solid var(--dis-gray-200);
}
#viewer-content.json-plain {
  background: var(--dis-gray-50);
  border: 1px solid var(--dis-gray-200);
  border-radius: .5rem;
}
#viewer-content.json-plain code {
  display: block;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}
#viewer-content.json-badged { background: transparent !important; }
#viewer-content .json-line-badge,
#viewer-content .jsonln,
#viewer-content .hljs-ln-line,
#viewer-content .prism-line,
#viewer-content .line-badge {
  display: contents !important;      /* conserva hijos, elimina el contenedor */
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* Pill inline del visor (aparece y se desvanece) */
#viewer-inline-status.pill-tmp {
  animation: viewerPillFade 2.4s ease-in-out forwards;
}
@keyframes viewerPillFade {
  0%   { opacity: 0; transform: translateY(-2px); }
  10%  { opacity: 1; transform: translateY(0); }
  85%  { opacity: 1; }
  100% { opacity: 0; transform: translateY(-2px); }
}
.modal-fullscreen { width: 100vw!important; height: 100vh!important; margin: 0!important; max-width: none!important; }
.modal-fullscreen .modal-content { height: 100%; border-radius: 0; }

/* === SYNTAX HIGHLIGHT === */
/* ==========================================================
   SQL Syntax Highlight
   ========================================================== */
#editor-container {
  background-color: #f8f8f8;
  border: 1px solid var(--dis-gray-300);
}
#editor-container-sql {
  background-color: #f8f8f8;
  border: 1px solid var(--dis-gray-300);
  overflow: auto;
  max-height: min(70vh, 650px);
  position: relative;
}
#content-preview {
  pointer-events: none;
  overflow: visible;        /* deja que pinte todo el contenido resaltado */
}
#content-textarea {
  overflow: hidden !important;
  height: auto !important;
  min-height: 420px;
}
textarea[name="content-sql"]::-webkit-scrollbar { 
  width: 10px; 
}
textarea[name="content-sql"]::-webkit-scrollbar-thumb {
  background-color: var(--dis-gray-300);
  border-radius: 6px;
}
textarea[name="content-sql"]::selection {
  background: var(--dis-blue-200);
  color: var(--dis-gray-900);
}
/* ==================== SQL Tokens ==================== */
.sql-comment { color: var(--sql-gray-600); font-style: italic; }
.sql-string  { color: var(--sql-red); }
.sql-keyword { color: var(--sql-indigo); }
.sql-type    { color: var(--sql-green); }
.sql-number  { color: var(--sql-purple); }
.sql-ident   { color: var(--sql-blue); }
.sql-func    { color: var(--sql-pink); }
.sql-var     { color: var(--sql-teal); }
.sql-op      { color: var(--sql-gray-700); }
/* Dark mode optional *//*
@media (prefers-color-scheme: dark) {
  :root {
    --sql-comment: #9ca3af;
    --sql-string:  #ff8787;
    --sql-keyword: #f783ac;
    --sql-type:    #38d9a9;
    --sql-number:  #8ce99a;
    --sql-ident:   #74c0fc;
    --sql-func:    #9775fa;
    --sql-op:      #dee2e6;
  }
}
*/
/* ==========================================================
   JSON Syntax Highlight 
   ========================================================== */
.json-punc { color: #6a737d; }           /* { } [ ] , : */
.json-key  { color: #008a60; }  /* "clave" */
.json-str  { color: #032f62; }           /* "texto" */
.json-num  { color: #d73a49; }           /* 123.45 */
.json-bool { color: #e36209; }           /* true / false */
.json-null { color: #a75555; font-style: italic; } /* null */
.json-date { color: #8a5cff; }  
.json-punc { color:#6a737d; }
.json-brace, .json-bracket, .json-colon, .json-comma { color: var(--sql-gray-700, #6b7280); }

/* Toggler y elipsis */
.json-tgl {
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.1em;
  padding: 0 .15em;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.json-tgl::before { content: "\25BE"; }
.json-tgl[data-state="closed"]::before { content: "\25B8"; }
.json-tgl:hover { color:#790f1d; }
.json-ellipsis  { color:#6b7280; font-style:italic; }
/* ==========================================================
   XML Syntax Highlight 
   ========================================================== */
.xml-tag { color: #2563eb; }
.xml-bracket { color: #2563eb; }
.xml-attr { color: #b45309; }
.xml-attr-value { color: #0f766e; }
.xml-comment { color: #6a737d; font-style: italic; }
.xml-decl, .xml-pi { color: #64748b; }
.xml-cdata { color: #7c2d12; }

#viewer-content.xml-wrap,
#viewer-content.xml-wrap code {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}



/* === UTILIDADES === */
.text-muted-strong { color: var(--dis-gray-600)!important; }
.text-green-strong, .text-blue-strong {
  font-weight: 600; font-size: .81rem;
}
.text-green-strong { color: var(--dis-green-600)!important; }
.text-blue-strong  { color: var(--dis-blue-600)!important; }
.bg-muted { background: var(--dis-gray-100)!important; }
.border-muted { border-color: var(--dis-gray-300)!important; }
.shadow-soft { box-shadow: 0 8px 24px rgba(33,37,41,.06); }
.round-2xl { border-radius: 1rem; }
.iohana-action-btn {
  min-width: 110px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.published-modal {
  max-width: 95vw;
}
.published-table {
  font-size: 0.78rem;
}
.published-table-tools .published-filter {
  min-width: 180px;
}
.published-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #111;
  color: #fff;
  text-transform: none;
  font-weight: 600;
  white-space: nowrap;
}
.published-table td,
.published-table th {
  vertical-align: middle;
  white-space: nowrap;
}
.published-table td.col-fieldname,
.published-table td.col-fieldvalue,
.published-table td.col-out_value {
  white-space: normal;
  min-width: 240px;
  max-width: 240px;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.published-table td.is-editing {
  padding: 0;
}
.published-table .published-edit-input {
  width: 100%;
  min-height: 28px;
  border: 0;
  outline: none;
  padding: 0.35rem 0.5rem;
  font-size: 0.78rem;
  background: #fffceb;
}
.published-table textarea.published-edit-input {
  min-height: 72px;
  resize: vertical;
}
.published-row-stage {
  background: #e6f3ff;
}
.published-row-validation {
  background: #f2dbe8;
}
.published-row-response {
  background: #f4e1ea;
}
.published-row-fallback {
  background: #eee2f6;
}
.published-row-table {
  background: #f7f4db;
}
.published-row-query {
  background: #def3f8;
}
.published-row-variable {
  background: #f5dede;
}
.published-row-field {
  background: #e5f3df;
}
.published-row-subfield {
  background: #f6e2e2;
}
.published-row-replace {
  background: #e1f3da;
}
.published-row-field.published-entity-version {
  background: #e4f5dd;
}
.published-row-field.published-entity-iddoc {
  background: #e3f0ff;
}
.published-row-field.published-entity-emisor {
  background: #f9efe0;
}
.published-row-field.published-entity-comprador {
  background: #efe3f7;
}
.published-row-field.published-entity-totales {
  background: #f7f8dd;
}
.published-row-field.published-entity-otramoneda {
  background: #dff3fa;
}
.published-row-field.published-entity-detallesitems,
.published-row-field.published-entity-tablacodigositem,
.published-row-subfield.published-entity-detallesitems,
.published-row-subfield.published-entity-tablacodigositem {
  background: #f7e1e1;
}

/* === REDUCIR ANIMACIONES === */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms!important; transition-duration: .01ms!important; }
}