/* ============================================================================
   THOR — TARJETA DE LICITACIÓN · look & feel Apple  [TARJETA OCT 2026]
   ----------------------------------------------------------------------------
   Skin nuevo del modal de licitación (#modalLicitacion). Se carga DESPUÉS de
   modal-apple.css y gana por especificidad (#modalLicitacion .tla …) + !important
   donde el fichero anterior también lo usa. Mismo HTML, mismos IDs y clases que
   usan los listeners (msb-nav-item[data-panel], msb-panel, editarCampo, botones
   de fase, asignaciones, docs-admin, PT…); solo cambia la presentación y se añade
   la cabecera «hero» (estado, expediente, organismo, KPIs y camino de fases).
   Estilo «Salud / Wallet»: la cabecera lleva un degradado del color de la fase,
   los KPIs son mosaicos blancos sobre ese color, el camino de fases es una barra
   de progreso, las pestañas son un control segmentado que se solapa con la
   cabecera y las acciones principales son botones grandes. Debajo, tarjetas
   blancas sobre gris como kanban-apple-redesign.css / prospeccion-apple.css.
   ============================================================================ */

:root {
  --tl-bg: #f5f5f7; --tl-card: #ffffff; --tl-card-2: #fafafa;
  --tl-text: #1d1d1f; --tl-text-2: #6e6e73; --tl-text-3: #a1a1a6;
  --tl-border: rgba(0, 0, 0, .07); --tl-border-2: rgba(0, 0, 0, .13);
  --tl-accent: #e88732; --tl-accent-soft: rgba(232, 135, 50, .14);
  --tl-blue: #0a84ff; --tl-blue-soft: rgba(10, 132, 255, .12);
  --tl-green: #34c759; --tl-green-soft: rgba(52, 199, 89, .14);
  --tl-red: #ff3b30; --tl-red-soft: rgba(255, 59, 48, .12);
  --tl-amber: #ff9f0a; --tl-amber-soft: rgba(255, 159, 10, .16);
  --tl-purple: #5e5ce6; --tl-purple-soft: rgba(94, 92, 230, .14);
  --tl-teal: #32ade6; --tl-teal-soft: rgba(50, 173, 230, .14);
  --tl-gray: #8e8e93; --tl-gray-soft: rgba(142, 142, 147, .16);
  --tl-r-lg: 20px; --tl-r: 16px; --tl-r-md: 12px; --tl-r-sm: 10px; --tl-pill: 980px;
  --tl-sh-card: 0 1px 2px rgba(0, 0, 0, .04), 0 4px 14px rgba(0, 0, 0, .05);
  --tl-sh-card-h: 0 6px 18px rgba(0, 0, 0, .10);
  --tl-sh-modal: 0 0 0 .5px rgba(0, 0, 0, .06), 0 24px 70px rgba(0, 0, 0, .22), 0 2px 10px rgba(0, 0, 0, .08);
  --tl-font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", Roboto, sans-serif;
  --tl-mono: "SF Mono", "JetBrains Mono", ui-monospace, Menlo, monospace;
  --tl-hover: rgba(0, 0, 0, .05);
}
[data-theme="dark"] {
  --tl-bg: #121214; --tl-card: #1c1c1e; --tl-card-2: #242426;
  --tl-text: #f5f5f7; --tl-text-2: #aeaeb2; --tl-text-3: #8e8e93;
  --tl-border: rgba(255, 255, 255, .09); --tl-border-2: rgba(255, 255, 255, .18);
  --tl-hover: rgba(255, 255, 255, .07);
  --tl-sh-card: 0 1px 2px rgba(0, 0, 0, .5), 0 6px 16px rgba(0, 0, 0, .35);
  --tl-sh-card-h: 0 10px 28px rgba(0, 0, 0, .6);
  --tl-sh-modal: 0 0 0 .5px rgba(255, 255, 255, .08), 0 24px 70px rgba(0, 0, 0, .7);
}

/* ===== CONTENEDOR ===== */
#modalLicitacion.modal-overlay-kanban { background: rgba(20, 20, 24, .42) !important; backdrop-filter: blur(16px) saturate(170%) !important; -webkit-backdrop-filter: blur(16px) saturate(170%) !important; }
#modalLicitacion .modal-container-kanban {
  max-width: 1040px !important; width: min(1040px, calc(100vw - 32px)) !important;
  background: var(--tl-bg) !important; border-radius: 22px !important; box-shadow: var(--tl-sh-modal) !important;
  overflow: hidden !important; border: none !important; font-family: var(--tl-font) !important; color: var(--tl-text) !important;
}
#modalLicitacion .modal-close-kanban {
  top: 14px !important; right: 14px !important; width: 32px !important; height: 32px !important; z-index: 30 !important;
  background: rgba(255, 255, 255, .26) !important; color: #fff !important; border-radius: 50% !important; backdrop-filter: blur(6px); border: none !important;
}
#modalLicitacion .modal-close-kanban:hover { background: rgba(255, 255, 255, .4) !important; }
#modalLicitacion .modal-close-kanban svg { color: #fff !important; stroke: #fff !important; width: 16px !important; height: 16px !important; }
/* El contenedor ya no hace scroll entero: la cabecera queda fija y el contenido de la pestaña se desplaza dentro */
#modalLicitacion .modal-container-kanban { display: flex !important; flex-direction: column !important; max-height: 92vh !important; overflow: hidden !important; }
#modalLicitacion .modal-body-kanban { padding: 0 !important; display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; min-height: 0 !important; }
#modalLicitacion .tla { display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; min-height: 0 !important; background: var(--tl-bg) !important; color: var(--tl-text) !important; font-family: var(--tl-font) !important; -webkit-font-smoothing: antialiased; }
#modalLicitacion .tla .tla-hero { flex: 0 0 auto !important; }
#modalLicitacion .tla *, #modalLicitacion .tla *::before, #modalLicitacion .tla *::after { box-sizing: border-box; }

/* ===== HERO (cabecera) ===== */
#modalLicitacion .tla .modal-header-modern.tla-hero {
  position: relative !important; padding: 20px 56px 40px 28px !important; border: none !important; border-radius: 0 !important; overflow: hidden !important;
  background: linear-gradient(135deg, var(--tla-estado-color, var(--tl-accent)) 0%, var(--tla-estado-color-2, var(--tla-estado-color, var(--tl-accent))) 100%) !important; color: #fff !important;
}
/* brillos suaves, como las tarjetas de Wallet */
#modalLicitacion .tla .tla-hero::before { content: ""; position: absolute; right: -140px; bottom: -200px; width: 460px; height: 460px; border-radius: 50%; background: radial-gradient(closest-side, rgba(255, 255, 255, .22), rgba(255, 255, 255, 0)); pointer-events: none; }
#modalLicitacion .tla .tla-hero::after { content: ""; position: absolute; left: -120px; top: -160px; width: 380px; height: 380px; border-radius: 50%; background: radial-gradient(closest-side, rgba(255, 255, 255, .16), rgba(255, 255, 255, 0)); pointer-events: none; }
#modalLicitacion .tla .tla-hero > * { position: relative; z-index: 1; }
#modalLicitacion .tla .tla-hero-top { display: flex !important; gap: 18px !important; align-items: flex-start !important; justify-content: space-between !important; flex-wrap: wrap !important; }
#modalLicitacion .tla .tla-hero-main { flex: 1 1 520px !important; min-width: 0 !important; }
#modalLicitacion .tla .tla-eyebrow { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; align-items: center !important; margin-bottom: 10px !important; }
#modalLicitacion .tla .modal-title-modern {
  font-size: 24px !important; font-weight: 700 !important; letter-spacing: -.025em !important; line-height: 1.2 !important;
  color: #fff !important; margin: 0 0 6px !important; padding: 0 !important; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-shadow: 0 1px 2px rgba(0, 0, 0, .12);
}
#modalLicitacion .tla .tla-org { font-size: 14px !important; color: rgba(255, 255, 255, .85) !important; display: flex !important; align-items: center !important; gap: 6px !important; margin-bottom: 14px !important; }
#modalLicitacion .tla .tla-org b { color: #fff !important; font-weight: 600 !important; }
#modalLicitacion .tla .tla-hero-actions { display: flex !important; gap: 8px !important; flex-wrap: wrap !important; align-items: center !important; padding-top: 2px !important; }

/* chips de la cabecera */
#modalLicitacion .tla .tla-chip {
  display: inline-flex !important; align-items: center !important; gap: 5px !important; height: 24px !important; padding: 0 10px !important;
  border-radius: var(--tl-pill) !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: .005em !important;
  background: rgba(255, 255, 255, .22) !important; color: #fff !important; border: none !important; white-space: nowrap !important; backdrop-filter: blur(4px);
}
#modalLicitacion .tla .tla-chip--exp { font-family: var(--tl-mono) !important; font-weight: 600 !important; letter-spacing: 0 !important; background: rgba(0, 0, 0, .16) !important; border: none !important; color: #fff !important; }
#modalLicitacion .tla .modal-status-modern {
  display: inline-flex !important; align-items: center !important; gap: 6px !important; height: 26px !important; padding: 0 11px !important;
  border-radius: var(--tl-pill) !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: .01em !important; text-transform: none !important;
  background: #fff !important; color: var(--tla-estado-color, var(--tl-text)) !important; border: none !important; background-image: none !important; box-shadow: 0 2px 8px rgba(0, 0, 0, .12) !important;
}
#modalLicitacion .tla .modal-status-modern::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--tla-estado-color, var(--tl-gray)); }
#modalLicitacion .tla .modal-urgency {
  display: inline-flex !important; align-items: center !important; gap: 4px !important; height: 24px !important; padding: 0 10px !important; margin: 0 !important;
  border-radius: var(--tl-pill) !important; font-size: 12px !important; font-weight: 700 !important; border: none !important;
  background: rgba(255, 255, 255, .22) !important; color: #fff !important; backdrop-filter: blur(4px);
}
/* clases reales de getUrgenciaClass: ≤3 días rojo, ≤7 naranja, ≤14 amarillo, resto verde; vencida rojo */
#modalLicitacion .tla .modal-urgency.text-red-600, #modalLicitacion .tla .modal-urgency.text-red-500 { background: #fff !important; color: #d7261c !important; box-shadow: 0 2px 8px rgba(0, 0, 0, .12) !important; }
#modalLicitacion .tla .modal-urgency.text-orange-500, #modalLicitacion .tla .modal-urgency.text-yellow-600 { background: #fff !important; color: #b15f00 !important; box-shadow: 0 2px 8px rgba(0, 0, 0, .12) !important; }
#modalLicitacion .tla .modal-urgency.text-green-600 { background: rgba(255, 255, 255, .22) !important; color: #fff !important; }
/* «🏆 Adjudicada: fecha ✏️» y «Cerrada: fecha» llegan con color inline: en la cabecera van en blanco */
#modalLicitacion .tla .modal-urgency[style] { background: rgba(255, 255, 255, .22) !important; color: #fff !important; border-color: transparent !important; }
#modalLicitacion .tla .modal-urgency[style] button { background: rgba(255, 255, 255, .25) !important; border: 1px solid rgba(255, 255, 255, .45) !important; color: #fff !important; border-radius: var(--tl-pill) !important; }
#modalLicitacion .tla .tla-chip--estrategica { background: #fff !important; color: #b15f00 !important; box-shadow: 0 2px 8px rgba(0, 0, 0, .12) !important; }

/* colores por estado (se aplican con la clase tla-estado-<estado> en .tla) */
#modalLicitacion .tla { --tla-estado-color: #e88732; --tla-estado-color-2: #f3a55a; --tla-estado-soft: var(--tl-accent-soft); }
#modalLicitacion .tla.tla-estado-analisis { --tla-estado-color: #5e5ce6; --tla-estado-color-2: #8f7dff; --tla-estado-soft: var(--tl-purple-soft); }
#modalLicitacion .tla.tla-estado-gonogo { --tla-estado-color: #f0a500; --tla-estado-color-2: #ffc83d; --tla-estado-soft: var(--tl-amber-soft); }
#modalLicitacion .tla.tla-estado-preparacion { --tla-estado-color: #0a84ff; --tla-estado-color-2: #55aaff; --tla-estado-soft: var(--tl-blue-soft); }
#modalLicitacion .tla.tla-estado-revision { --tla-estado-color: #b04ee6; --tla-estado-color-2: #d98cff; --tla-estado-soft: rgba(191, 90, 242, .14); }
#modalLicitacion .tla.tla-estado-presentacion { --tla-estado-color: #e8711f; --tla-estado-color-2: #f7a04a; --tla-estado-soft: var(--tl-accent-soft); }
#modalLicitacion .tla.tla-estado-presentada { --tla-estado-color: #1f9fc9; --tla-estado-color-2: #5ac8fa; --tla-estado-soft: var(--tl-teal-soft); }
#modalLicitacion .tla.tla-estado-adjudicada { --tla-estado-color: #28a745; --tla-estado-color-2: #5ce07a; --tla-estado-soft: var(--tl-green-soft); }
#modalLicitacion .tla.tla-estado-perdida { --tla-estado-color: #e0352b; --tla-estado-color-2: #ff7a6e; --tla-estado-soft: var(--tl-red-soft); }
#modalLicitacion .tla.tla-estado-desierta { --tla-estado-color: #8e8e93; --tla-estado-color-2: #b4b4b9; --tla-estado-soft: var(--tl-gray-soft); }
#modalLicitacion .tla.tla-estado-nogo { --tla-estado-color: #5c5c61; --tla-estado-color-2: #8e8e93; --tla-estado-soft: var(--tl-gray-soft); }
#modalLicitacion .tla.tla-estado-localret { --tla-estado-color: #d99400; --tla-estado-color-2: #f5bd3c; --tla-estado-soft: var(--tl-amber-soft); }
#modalLicitacion .tla.tla-estado-triaje { --tla-estado-color: #10a37f; --tla-estado-color-2: #4fd1a5; --tla-estado-soft: var(--tl-green-soft); }
#modalLicitacion .tla.tla-estado-invitacion { --tla-estado-color: #7c5cff; --tla-estado-color-2: #a68bff; --tla-estado-soft: var(--tl-purple-soft); }
#modalLicitacion .tla.tla-estado-favorita { --tla-estado-color: #e5a100; --tla-estado-color-2: #ffc83d; --tla-estado-soft: var(--tl-amber-soft); }

/* KPIs */
#modalLicitacion .tla .tla-kpis { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 12px !important; margin: 4px 0 18px !important; }
#modalLicitacion .tla .tla-kpi {
  display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; min-width: 0 !important; min-height: 112px !important;
  background: var(--tl-card) !important; border: none !important; border-radius: 18px !important; padding: 14px 16px !important; box-shadow: 0 10px 28px rgba(0, 0, 0, .16), 0 1px 2px rgba(0, 0, 0, .06) !important;
  transition: transform .15s, box-shadow .15s !important;
}
#modalLicitacion .tla .tla-kpi:hover { transform: translateY(-2px) !important; box-shadow: 0 14px 34px rgba(0, 0, 0, .2) !important; }
#modalLicitacion .tla .tla-kpi-ico { width: 40px; height: 40px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; font-size: 20px; flex: 0 0 auto; background: var(--tl-bg); }
#modalLicitacion .tla .tla-kpi--importe .tla-kpi-ico { background: var(--tl-green-soft); }
#modalLicitacion .tla .tla-kpi--fecha .tla-kpi-ico { background: var(--tl-amber-soft); }
#modalLicitacion .tla .tla-avatar { width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 700; color: #fff; flex: 0 0 auto; letter-spacing: .02em; background: linear-gradient(135deg, #0a84ff, #5e5ce6); }
#modalLicitacion .tla .tla-avatar--preventa { background: linear-gradient(135deg, #e88732, #ff9f0a); }
#modalLicitacion .tla .tla-avatar--vacio { background: var(--tl-gray-soft); color: var(--tl-text-3); border: 1.5px dashed var(--tl-border-2); }
#modalLicitacion .tla .tla-kpi-txt { min-width: 0; width: 100%; display: flex; flex-direction: column; gap: 2px; }
#modalLicitacion .tla .tla-kpi-label { font-size: 10.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--tl-text-3); }
#modalLicitacion .tla .tla-kpi-value { font-size: 19px; font-weight: 800; letter-spacing: -.02em; line-height: 1.15; color: var(--tl-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#modalLicitacion .tla .tla-kpi-sub { font-size: 12px; color: var(--tl-text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#modalLicitacion .tla .tla-kpi-sub.es-rojo { color: #c8261c; font-weight: 600; }
#modalLicitacion .tla .tla-kpi-sub.es-ambar { color: #b15f00; font-weight: 600; }
#modalLicitacion .tla .tla-kpi-sub.es-verde { color: #1f8a3b; font-weight: 600; }
#modalLicitacion .tla .tla-kpi-value.es-vacio { color: var(--tl-text-3); font-weight: 500; }

/* Camino de fases (stepper) */
#modalLicitacion .tla .tla-steps { display: flex !important; align-items: stretch !important; gap: 6px !important; margin: 0 !important; padding: 0 !important; overflow-x: auto !important; }
#modalLicitacion .tla .tla-step { position: relative; flex: 1 1 0; min-width: 60px; display: flex; flex-direction: column; align-items: stretch; gap: 7px; text-align: center; }
#modalLicitacion .tla .tla-step::before { display: none; }
#modalLicitacion .tla .tla-step-dot { display: block; width: 100%; height: 6px; border-radius: 3px; background: rgba(255, 255, 255, .3); border: none; }
#modalLicitacion .tla .tla-step--done .tla-step-dot { background: rgba(255, 255, 255, .9); }
#modalLicitacion .tla .tla-step--done .tla-step-dot::after { content: none; }
#modalLicitacion .tla .tla-step--actual .tla-step-dot { background: #fff; box-shadow: 0 0 0 2px rgba(255, 255, 255, .3), 0 0 16px rgba(255, 255, 255, .8); }
#modalLicitacion .tla .tla-step--final .tla-step-dot { background: #fff; }
#modalLicitacion .tla .tla-step-label { font-size: 11px; color: rgba(255, 255, 255, .62); font-weight: 600; line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#modalLicitacion .tla .tla-step--done .tla-step-label { color: rgba(255, 255, 255, .88); }
#modalLicitacion .tla .tla-step--actual .tla-step-label, #modalLicitacion .tla .tla-step--final .tla-step-label { color: #fff; font-weight: 800; }

/* botones de la cabecera (pills) */
#modalLicitacion .tla .tla-btn {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; height: 32px !important; padding: 0 13px !important;
  border-radius: var(--tl-pill) !important; border: 1px solid rgba(255, 255, 255, .38) !important; background: rgba(255, 255, 255, .2) !important; color: #fff !important; backdrop-filter: blur(6px);
  font-family: var(--tl-font) !important; font-size: 12.5px !important; font-weight: 700 !important; cursor: pointer !important; text-decoration: none !important; white-space: nowrap !important;
  transition: background .15s, transform .12s, box-shadow .15s !important; box-shadow: none !important; line-height: 1 !important; margin: 0 !important;
}
#modalLicitacion .tla .tla-btn:hover { background: rgba(255, 255, 255, .32) !important; text-decoration: none !important; }
#modalLicitacion .tla .tla-btn--primary { background: var(--tl-blue) !important; border-color: var(--tl-blue) !important; color: #fff !important; }
#modalLicitacion .tla .tla-btn--primary:hover { background: #0071e3 !important; }
#modalLicitacion .tla .tla-btn--accent { background: var(--tl-accent) !important; border-color: var(--tl-accent) !important; color: #fff !important; }
#modalLicitacion .tla .tla-btn--accent:hover { background: #d6792a !important; }
#modalLicitacion .tla .tla-btn--dynamics { background: #fff !important; border-color: #fff !important; color: var(--tla-estado-color, #0a5fd0) !important; box-shadow: 0 2px 10px rgba(0, 0, 0, .14) !important; }
#modalLicitacion .tla .tla-btn--dynamics:hover { background: #fff !important; transform: translateY(-1px) !important; }

/* ===== PESTAÑAS (control segmentado) ===== */
#modalLicitacion .tla .msb-layout { display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; min-height: 260px !important; max-height: none !important; border: none !important; overflow: hidden !important; background: transparent !important; margin-top: -22px !important; position: relative !important; z-index: 2 !important; }
#modalLicitacion .tla .msb-sidebar {
  width: auto !important; min-width: 0 !important; flex: 0 0 auto !important; display: flex !important; flex-direction: row !important; gap: 2px !important;
  margin: 0 28px 14px !important; padding: 4px !important; border: none !important; border-radius: 14px !important;
  background: var(--tl-card) !important; box-shadow: 0 8px 24px rgba(0, 0, 0, .14), 0 1px 2px rgba(0, 0, 0, .06) !important; overflow-x: auto !important; overflow-y: hidden !important;
}
#modalLicitacion .tla .msb-nav-item {
  flex: 1 1 0 !important; width: auto !important; justify-content: center !important; gap: 7px !important; padding: 7px 12px !important;
  border-radius: 9px !important; font-size: 13px !important; font-weight: 600 !important; color: var(--tl-text-2) !important; background: transparent !important;
  text-align: center !important; white-space: nowrap !important; transition: background .15s, color .15s, box-shadow .15s !important; position: relative !important;
}
#modalLicitacion .tla .msb-nav-item { padding: 9px 12px !important; }
#modalLicitacion .tla .msb-nav-item:hover { color: var(--tl-text) !important; background: var(--tl-hover) !important; }
#modalLicitacion .tla .msb-nav-item.active { background: var(--tla-estado-soft, var(--tl-gray-soft)) !important; color: var(--tla-estado-color, var(--tl-text)) !important; box-shadow: none !important; }
#modalLicitacion .tla .msb-nav-icon { width: auto !important; font-size: 14px !important; }
#modalLicitacion .tla .msb-nav-text { flex: 0 0 auto !important; }
#modalLicitacion .tla .msb-nav-badge { position: static !important; margin-left: 2px !important; background: var(--tl-red) !important; color: #fff !important; border-radius: var(--tl-pill) !important; font-size: 10px !important; font-weight: 700 !important; padding: 1px 6px !important; line-height: 1.4 !important; }

/* ===== CONTENIDO ===== */
#modalLicitacion .tla .msb-content { flex: 1 1 auto !important; background: var(--tl-bg) !important; overflow-y: auto !important; padding: 2px 28px 24px !important; }
#modalLicitacion .tla .msb-panel { padding: 0 !important; animation: tlaFade .18s ease !important; }
#modalLicitacion .tla .msb-panel.active { display: flex !important; flex-direction: column !important; gap: 12px !important; }
@keyframes tlaFade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* tarjetas */
#modalLicitacion .tla .msb-section, #modalLicitacion .tla .msb-chat-section, #modalLicitacion .tla #panel-general > .modal-fields-modern {
  margin: 0 !important; padding: 16px 18px !important; background: var(--tl-card) !important; border: 1px solid var(--tl-border) !important;
  border-radius: var(--tl-r) !important; box-shadow: var(--tl-sh-card) !important;
}
#modalLicitacion .tla .msb-section:last-child { margin-bottom: 0 !important; }
#modalLicitacion .tla .msb-section-title {
  display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important;
  font-size: 11.5px !important; font-weight: 700 !important; letter-spacing: .07em !important; text-transform: uppercase !important; color: var(--tl-text-3) !important;
  margin: 0 0 12px !important; padding: 0 !important; border: none !important;
}

/* ===== GENERAL: campos ===== */
#modalLicitacion .tla .modal-fields-modern { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px 14px !important; }
#modalLicitacion .tla .modal-field-group { margin: 0 !important; min-width: 0 !important; }
#modalLicitacion .tla .modal-fields-modern > .modal-field-group:nth-child(-n+3) { grid-column: 1 / -1 !important; } /* título, organismo y expediente a todo el ancho */
#modalLicitacion .tla .modal-field-row { grid-column: 1 / -1 !important; display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px 14px !important; margin: 0 !important; }
#modalLicitacion .tla .modal-field-label { display: block !important; font-size: 10.5px !important; font-weight: 600 !important; letter-spacing: .07em !important; text-transform: uppercase !important; color: var(--tl-text-3) !important; margin: 0 0 4px 2px !important; }
#modalLicitacion .tla .modal-field-content {
  display: flex !important; align-items: center !important; gap: 8px !important; min-height: 40px !important;
  background: var(--tl-card-2) !important; border: 1px solid var(--tl-border) !important; border-radius: var(--tl-r-sm) !important; padding: 8px 12px !important;
  transition: border-color .15s, background .15s, box-shadow .15s !important;
}
#modalLicitacion .tla .modal-field-content:hover { background: var(--tl-card) !important; border-color: var(--tl-border-2) !important; box-shadow: 0 1px 4px rgba(0, 0, 0, .05) !important; }
#modalLicitacion .tla .modal-field-value { flex: 1 1 auto !important; min-width: 0 !important; font-size: 14px !important; font-weight: 500 !important; color: var(--tl-text) !important; line-height: 1.35 !important; overflow-wrap: anywhere !important; }
#modalLicitacion .tla #modalImporte.modal-field-value { font-size: 16px !important; font-weight: 700 !important; letter-spacing: -.01em !important; }
#modalLicitacion .tla .modal-field-value .text-gray-500, #modalLicitacion .tla .modal-field-value.text-gray-600 { color: var(--tl-text-3) !important; font-weight: 400 !important; }
#modalLicitacion .tla .modal-link, #modalLicitacion .tla .dynamics-link { color: var(--tl-blue) !important; font-weight: 600 !important; text-decoration: none !important; overflow-wrap: anywhere !important; }
#modalLicitacion .tla .modal-link:hover { text-decoration: underline !important; }
/* enlace «Abrir» junto al valor: píldora pequeña, sin partir la palabra */
#modalLicitacion .tla .modal-field-content > a.modal-link { flex: 0 0 auto !important; white-space: nowrap !important; overflow-wrap: normal !important; margin: 0 !important; padding: 4px 10px !important; border-radius: 980px !important; background: var(--tl-blue-soft) !important; font-size: 12.5px !important; }
#modalLicitacion .tla .modal-field-content > a.modal-link:hover { text-decoration: none !important; background: var(--tl-blue) !important; color: #fff !important; }
#modalLicitacion .tla .modal-edit-btn, #modalLicitacion .tla .editarCampo {
  flex: 0 0 auto !important; width: 28px !important; height: 28px !important; border-radius: 8px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important;
  background: transparent !important; color: var(--tl-blue) !important; border: none !important; opacity: 0 !important; cursor: pointer !important; font-size: 14px !important; transition: opacity .15s, background .15s !important;
}
#modalLicitacion .tla .modal-field-content:hover .modal-edit-btn, #modalLicitacion .tla .modal-field-content:hover .editarCampo, #modalLicitacion .tla .modal-edit-btn:focus-visible { opacity: 1 !important; }
#modalLicitacion .tla .modal-edit-btn:hover { background: var(--tl-blue-soft) !important; }
#modalLicitacion .tla .modal-field-input-edit { border: 2px solid var(--tl-blue) !important; border-radius: var(--tl-r-sm) !important; padding: 8px 12px !important; font: inherit !important; font-size: 14px !important; background: var(--tl-card) !important; color: var(--tl-text) !important; width: 100% !important; }

/* chat */
#modalLicitacion .tla .msb-chat-section { padding: 16px 18px !important; }
#modalLicitacion .tla .msb-chat-section::before { content: "💬  Comentarios"; display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--tl-text-3); margin-bottom: 12px; }
#modalLicitacion .tla .modal-comments-section { background: transparent !important; border: none !important; padding: 0 !important; margin: 0 !important; }
#modalLicitacion .tla .modal-comment-bubble { border-radius: 16px !important; }
#modalLicitacion .tla .modal-no-comments { color: var(--tl-text-3) !important; font-size: 13px !important; text-align: center !important; padding: 14px !important; }

/* ===== GESTIÓN: fase ===== */
#modalLicitacion .tla .msb-phase-container { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; gap: 10px !important; background: transparent !important; border: none !important; padding: 0 !important; margin: 0 !important; }
/* la fase actual ocupa su fila; debajo, ← Retroceder (secundario) y Avanzar → (grande, del color de la fase) */
#modalLicitacion .tla .msb-phase-current { flex: 0 0 100% !important; width: 100% !important; display: flex !important; align-items: center !important; gap: 10px !important; height: 46px !important; padding: 0 16px 0 14px !important; border-radius: 14px !important; background: var(--tla-estado-soft, var(--tl-gray-soft)) !important; color: var(--tla-estado-color, var(--tl-text)) !important; font-weight: 700 !important; font-size: 14px !important; margin: 0 !important; border: none !important; }
#modalLicitacion .tla .msb-phase-current::before { content: "Fase actual"; font-size: 10.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; opacity: .7; margin-left: auto; order: 2; }
#modalLicitacion .tla .msb-phase-current-dot { width: 12px !important; height: 12px !important; border-radius: 50% !important; background: var(--tla-estado-color, var(--tl-gray)) !important; box-shadow: 0 0 0 4px rgba(255, 255, 255, .6) !important; animation: none !important; order: 0; }
#modalLicitacion .tla .msb-phase-current-text { font-size: 15px !important; color: inherit !important; order: 1; }
#modalLicitacion .tla .msb-phase-btn {
  display: inline-flex !important; align-items: center !important; gap: 12px !important; height: 56px !important; width: auto !important; flex: 0 1 auto !important; padding: 0 18px !important; margin: 0 !important;
  border-radius: 16px !important; border: 1px solid var(--tl-border-2) !important; background: var(--tl-card) !important; color: var(--tl-text) !important; cursor: pointer !important;
  font-family: var(--tl-font) !important; box-shadow: none !important; transition: transform .12s, box-shadow .15s, background .15s, filter .15s !important; text-align: left !important;
}
#modalLicitacion .tla .msb-phase-btn:hover:not(:disabled) { transform: translateY(-1px) !important; box-shadow: var(--tl-sh-card-h) !important; }
#modalLicitacion .tla .msb-phase-btn--forward { flex: 1 1 auto !important; justify-content: space-between !important; background: linear-gradient(135deg, var(--tla-estado-color, var(--tl-blue)), var(--tla-estado-color-2, var(--tl-blue))) !important; border-color: transparent !important; color: #fff !important; margin-left: auto !important; box-shadow: 0 8px 20px -6px var(--tla-estado-color, var(--tl-blue)) !important; }
#modalLicitacion .tla .msb-phase-btn--forward:hover:not(:disabled) { filter: brightness(1.06) !important; }
#modalLicitacion .tla .msb-phase-btn--forward .msb-phase-btn-label { font-size: 15px !important; }
#modalLicitacion .tla .msb-phase-btn--forward .msb-phase-btn-label, #modalLicitacion .tla .msb-phase-btn--forward .msb-phase-btn-dest, #modalLicitacion .tla .msb-phase-btn--forward .msb-phase-btn-icon { color: #fff !important; }
#modalLicitacion .tla .msb-phase-btn--forward .msb-phase-btn-dest { opacity: .85 !important; }
#modalLicitacion .tla .msb-phase-btn--blocked, #modalLicitacion .tla .msb-phase-btn:disabled { background: var(--tl-gray-soft) !important; border-color: transparent !important; color: var(--tl-text-2) !important; cursor: not-allowed !important; transform: none !important; box-shadow: none !important; }
#modalLicitacion .tla .msb-phase-btn--blocked .msb-phase-btn-label, #modalLicitacion .tla .msb-phase-btn--blocked .msb-phase-btn-dest, #modalLicitacion .tla .msb-phase-btn--blocked .msb-phase-btn-icon { color: var(--tl-text-2) !important; }
#modalLicitacion .tla .msb-phase-btn-icon { width: 30px !important; height: 30px !important; border-radius: 50% !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; background: rgba(255, 255, 255, .18) !important; font-size: 14px !important; margin: 0 !important; }
#modalLicitacion .tla .msb-phase-btn--back .msb-phase-btn-icon { background: var(--tl-gray-soft) !important; color: var(--tl-text-2) !important; }
#modalLicitacion .tla .msb-phase-btn-text { display: flex !important; flex-direction: column !important; gap: 1px !important; }
#modalLicitacion .tla .msb-phase-btn-label { font-size: 13px !important; font-weight: 700 !important; }
#modalLicitacion .tla .msb-phase-btn-dest { font-size: 11px !important; opacity: .8 !important; }
#modalLicitacion .tla .modal-actions-modern { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; margin: 12px 0 0 !important; padding: 0 !important; background: transparent !important; border: none !important; }
#modalLicitacion .tla .modal-actions-modern:empty { display: none !important; }
#modalLicitacion .tla .msb-alert { display: flex !important; gap: 10px !important; align-items: flex-start !important; background: var(--tl-amber-soft) !important; border: 1px solid rgba(255, 159, 10, .35) !important; border-radius: var(--tl-r-md) !important; padding: 10px 12px !important; margin: 0 0 12px !important; color: #7a4a00 !important; }
#modalLicitacion .tla .msb-alert strong { font-size: 13px !important; color: #7a4a00 !important; }
#modalLicitacion .tla .msb-alert p { font-size: 12px !important; margin: 2px 0 0 !important; color: #8a5a10 !important; }

/* asignaciones */
#modalLicitacion .tla .msb-assignments { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
#modalLicitacion .tla .msb-assignment-card { background: var(--tl-card-2) !important; border: 1px solid var(--tl-border) !important; border-radius: var(--tl-r-md) !important; padding: 12px 14px !important; margin: 0 !important; }
#modalLicitacion .tla .msb-assignment-card--warning { background: var(--tl-amber-soft) !important; border-color: rgba(255, 159, 10, .35) !important; }
#modalLicitacion .tla .msb-assignment-label { font-size: 10.5px !important; font-weight: 600 !important; letter-spacing: .07em !important; text-transform: uppercase !important; color: var(--tl-text-3) !important; margin: 0 0 6px !important; }
#modalLicitacion .tla .msb-assignment-row { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; }
#modalLicitacion .tla .msb-assignment-name { font-size: 14.5px !important; font-weight: 700 !important; color: var(--tl-text) !important; }
#modalLicitacion .tla .msb-assignment-name--warning { color: #b15f00 !important; font-weight: 600 !important; }
#modalLicitacion .tla .msb-btn-assign { height: 28px !important; padding: 0 12px !important; border-radius: var(--tl-pill) !important; border: 1px solid var(--tl-border-2) !important; background: var(--tl-card) !important; color: var(--tl-blue) !important; font-size: 12px !important; font-weight: 600 !important; cursor: pointer !important; }
#modalLicitacion .tla .msb-btn-assign:hover { background: var(--tl-blue-soft) !important; }

/* documentos y herramientas: botones como fichas */
#modalLicitacion .tla .msb-docs-grid, #modalLicitacion .tla .msb-tools-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important; gap: 10px !important; align-items: stretch !important; }
#modalLicitacion .tla .msb-docs-grid .modal-actions-modern__group { display: contents !important; }
#modalLicitacion .tla .pliego-btn-wrapper { display: flex !important; align-items: stretch !important; gap: 4px !important; min-width: 0 !important; }
#modalLicitacion .tla .pliego-btn-wrapper > .modal-action-btn { flex: 1 1 auto !important; }
#modalLicitacion .tla .msb-docs-grid > .modal-action-btn, #modalLicitacion .tla .msb-tools-grid > .modal-action-btn, #modalLicitacion .tla .msb-tools-grid > .btn-estrategica { width: 100% !important; }
#modalLicitacion .tla .modal-action-btn, #modalLicitacion .tla .pliego-cambiar-btn, #modalLicitacion .tla .btn-estrategica {
  display: inline-flex !important; align-items: center !important; justify-content: flex-start !important; gap: 9px !important; min-height: 58px !important; padding: 0 16px !important; margin: 0 !important;
  border-radius: 16px !important; border: 1px solid transparent !important; background: var(--tl-gray-soft) !important; color: var(--tl-text) !important; background-image: none !important;
  font-family: var(--tl-font) !important; font-size: 14px !important; font-weight: 700 !important; cursor: pointer !important; text-decoration: none !important; box-shadow: none !important;
  transition: transform .12s, box-shadow .15s, background .15s, border-color .15s, filter .15s !important; line-height: 1.2 !important; text-align: left !important; width: auto !important;
}
/* colores de las fichas de herramientas (por posición; las clases de abajo mandan cuando existen) */
#modalLicitacion .tla .msb-tools-grid > :nth-child(6n+1) { background: var(--tl-green-soft) !important; color: #1f8a3b !important; }
#modalLicitacion .tla .msb-tools-grid > :nth-child(6n+2) { background: var(--tl-blue-soft) !important; color: #0a5fd0 !important; }
#modalLicitacion .tla .msb-tools-grid > :nth-child(6n+3) { background: var(--tl-purple-soft) !important; color: #4b48d6 !important; }
#modalLicitacion .tla .msb-tools-grid > :nth-child(6n+4) { background: var(--tl-teal-soft) !important; color: #0b7aa3 !important; }
#modalLicitacion .tla .msb-tools-grid > :nth-child(6n+5) { background: var(--tl-amber-soft) !important; color: #b15f00 !important; }
#modalLicitacion .tla .msb-tools-grid > :nth-child(6n+6) { background: var(--tl-red-soft) !important; color: #c8261c !important; }
#modalLicitacion .tla .msb-tools-grid > .btn-estrategica { background: var(--tl-gray-soft) !important; color: var(--tl-text-2) !important; }
#modalLicitacion .tla .msb-tools-grid > .btn-estrategica.activa { background: var(--tl-amber-soft) !important; color: #b15f00 !important; }
#modalLicitacion .tla .modal-action-btn:hover:not(:disabled), #modalLicitacion .tla .pliego-cambiar-btn:hover, #modalLicitacion .tla .btn-estrategica:hover { transform: translateY(-1px) !important; box-shadow: var(--tl-sh-card-h) !important; filter: saturate(1.15) !important; }
#modalLicitacion .tla .modal-action-btn:disabled { opacity: .55 !important; cursor: not-allowed !important; transform: none !important; }
#modalLicitacion .tla .modal-action-btn svg, #modalLicitacion .tla .msb-phase-btn svg { width: 16px !important; height: 16px !important; flex: 0 0 auto !important; } /* iconos inline (no depender de las utilidades w-4/h-4 de Tailwind) */
#modalLicitacion .tla .modal-pdf-btn--ppt, #modalLicitacion .tla .modal-pdf-btn--pcap { background: var(--tl-red-soft) !important; color: #b3261e !important; border-color: transparent !important; }
#modalLicitacion .tla .modal-pdf-btn[data-tiene="0"] { background: var(--tl-card) !important; color: var(--tl-text-2) !important; border: 1px dashed var(--tl-border-2) !important; box-shadow: none !important; }
#modalLicitacion .tla .pliego-cambiar-btn { padding: 0 12px !important; color: var(--tl-text-2) !important; background: var(--tl-card-2) !important; border: 1px solid var(--tl-border) !important; }
#modalLicitacion .tla .modal-btn-docs-admin { background: var(--tl-purple-soft) !important; color: #4b48d6 !important; border-color: transparent !important; }
#modalLicitacion .tla .modal-btn-docs-admin:hover { background: rgba(94, 92, 230, .22) !important; }
#modalLicitacion .tla #badgeDocsAdmin_x, #modalLicitacion .tla [id^="badgeDocsAdmin_"] { background: rgba(94, 92, 230, .18) !important; color: #4b48d6 !important; border-radius: var(--tl-pill) !important; }
#modalLicitacion .tla .modal-btn-success { background: var(--tl-green-soft) !important; color: #1f8a3b !important; border-color: transparent !important; }
#modalLicitacion .tla .modal-btn-secondary { background: var(--tl-card-2) !important; color: var(--tl-text-2) !important; border: 1px solid var(--tl-border) !important; }
#modalLicitacion .tla .modal-actions-modern .modal-action-btn { flex: 0 0 auto !important; width: auto !important; min-height: 40px !important; font-size: 13px !important; border-radius: var(--tl-pill) !important; padding: 0 14px !important; }
#modalLicitacion .tla .modal-actions-modern .modal-btn-danger { background: var(--tl-red-soft) !important; color: #c8261c !important; }
#modalLicitacion .tla .modal-actions-modern .modal-btn-warning { background: var(--tl-amber-soft) !important; color: #b15f00 !important; }
#modalLicitacion .tla .btn-estrategica.activa { background: var(--tl-amber-soft) !important; color: #b15f00 !important; border-color: transparent !important; }
#modalLicitacion .tla .msb-docs-presentados .pf-resumen-tarjeta { margin-top: 12px !important; border-radius: var(--tl-r-md) !important; background: var(--tl-card-2) !important; }

/* PT (la sección ya es Apple; se encaja en la tarjeta) */
#modalLicitacion .tla .pt-section { border: none !important; box-shadow: none !important; background: transparent !important; padding: 0 !important; margin: 0 !important; }
#modalLicitacion .tla .pt-section-header { padding: 0 0 10px !important; border: none !important; background: transparent !important; }
#modalLicitacion .tla .pt-section-header h4 { font-size: 11.5px !important; font-weight: 700 !important; letter-spacing: .07em !important; text-transform: uppercase !important; color: var(--tl-text-3) !important; }
#modalLicitacion .tla .pt-section-body { padding: 0 !important; }
#modalLicitacion .tla #planNegocioSection > div { border-radius: var(--tl-r-md) !important; }

/* ===== ACTIVIDADES ===== */
#modalLicitacion .tla [id^="btnNuevaActividad_"] { height: 30px !important; padding: 0 14px !important; border-radius: var(--tl-pill) !important; background: var(--tl-accent) !important; color: #fff !important; font-size: 12px !important; font-weight: 700 !important; border: none !important; text-transform: none !important; letter-spacing: 0 !important; }
#modalLicitacion .tla [id^="formNuevaActividad_"] { background: var(--tl-card-2) !important; border: 1px solid var(--tl-border) !important; border-radius: var(--tl-r-md) !important; padding: 14px !important; }
#modalLicitacion .tla [id^="formNuevaActividad_"] label { color: var(--tl-text-3) !important; font-size: 10.5px !important; font-weight: 600 !important; letter-spacing: .06em !important; text-transform: uppercase !important; }
#modalLicitacion .tla [id^="formNuevaActividad_"] input[type="text"], #modalLicitacion .tla [id^="formNuevaActividad_"] input[type="email"], #modalLicitacion .tla [id^="formNuevaActividad_"] input[type="tel"], #modalLicitacion .tla [id^="formNuevaActividad_"] input[type="datetime-local"], #modalLicitacion .tla [id^="formNuevaActividad_"] select, #modalLicitacion .tla [id^="formNuevaActividad_"] textarea {
  border: 1px solid var(--tl-border-2) !important; border-radius: var(--tl-r-sm) !important; background: var(--tl-card) !important; color: var(--tl-text) !important; font-family: var(--tl-font) !important; font-size: 13px !important; padding: 8px 10px !important;
}
#modalLicitacion .tla [id^="formNuevaActividad_"] input:focus, #modalLicitacion .tla [id^="formNuevaActividad_"] select:focus, #modalLicitacion .tla [id^="formNuevaActividad_"] textarea:focus { outline: none !important; border-color: var(--tl-blue) !important; box-shadow: 0 0 0 3px var(--tl-blue-soft) !important; }
#modalLicitacion .tla [id^="actParticipantes_"] { border-radius: var(--tl-r-sm) !important; border: 1px solid var(--tl-border-2) !important; background: var(--tl-card) !important; }
#modalLicitacion .tla [id^="btnGuardarActividad_"] { border-radius: var(--tl-pill) !important; background: var(--tl-blue) !important; height: 32px !important; padding: 0 16px !important; font-weight: 700 !important; }
#modalLicitacion .tla [id^="btnCancelarActividad_"] { border-radius: var(--tl-pill) !important; background: var(--tl-card) !important; border: 1px solid var(--tl-border-2) !important; height: 32px !important; padding: 0 14px !important; }
#modalLicitacion .tla .actividad-card { border-radius: var(--tl-r-md) !important; background: var(--tl-card-2) !important; border: 1px solid var(--tl-border) !important; border-left-width: 4px !important; padding: 12px 14px !important; margin-bottom: 8px !important; }
#modalLicitacion .tla .actividad-card:hover { background: var(--tl-card) !important; box-shadow: var(--tl-sh-card) !important; }
#modalLicitacion .tla .actividad-card button { border-radius: var(--tl-pill) !important; height: 26px !important; padding: 0 10px !important; font-weight: 700 !important; }

/* ===== HUGINN (cliente) ===== */
#modalLicitacion .tla #panel-cliente .msb-section { background: var(--tl-card) !important; }

/* ===== Responsive ===== */
@media (max-width: 760px) {
  #modalLicitacion .tla .modal-header-modern.tla-hero { padding: 18px 48px 36px 16px !important; }
  #modalLicitacion .tla .tla-kpis { grid-template-columns: 1fr 1fr !important; }
  #modalLicitacion .tla .msb-sidebar, #modalLicitacion .tla .msb-content { margin-left: 12px !important; margin-right: 12px !important; padding-left: 0 !important; padding-right: 0 !important; }
  #modalLicitacion .tla .msb-content { padding: 0 12px 16px !important; }
  #modalLicitacion .tla .msb-nav-text { display: none !important; }
  #modalLicitacion .tla .modal-fields-modern, #modalLicitacion .tla .modal-field-row, #modalLicitacion .tla .msb-assignments { grid-template-columns: 1fr !important; }
  #modalLicitacion .tla .modal-title-modern { font-size: 20px !important; }
}
@media (prefers-reduced-motion: reduce) { #modalLicitacion .tla * { transition: none !important; animation: none !important; } }
