/* ═══════════════════════════════════════════════════════
   LEX CONSULTOR AGENTS — Soporte: Estilos Exclusivos
   Pipeline modal (pipe-tab-btn, pipe-logic-input, etc.)
════════════════════════════════════════════════════════ */

.pipe-tab-btn{display:inline-flex;align-items:center;gap:5px;padding:7px 14px;border-radius:6px 6px 0 0;font-size:11px;font-weight:600;cursor:pointer;background:var(--d4);border:1px solid var(--b1);border-bottom:none;color:var(--t3);transition:all .2s;font-family:inherit}
.pipe-tab-btn:hover{color:var(--t2)}
.pipe-tab-btn.on{background:var(--d1);border-color:var(--gold-dim);color:var(--gold-light)}
.pipe-tab-panel{background:var(--d1);border:1px solid var(--b1);border-radius:0 6px 6px 6px;padding:16px;display:none}
.pipe-logic-label{font-size:10.5px;font-weight:500;color:var(--t2);margin-bottom:5px;display:block}
.pipe-logic-input{width:100%;background:var(--d2);border:1px solid var(--b1);border-radius:6px;padding:8px 11px;font-size:12px;color:var(--t1);outline:0;font-family:inherit;transition:border-color .2s}
.pipe-logic-input:focus{border-color:var(--gold-dim);box-shadow:0 0 0 3px rgba(242,101,34,.07)}
.pipe-logic-sel{width:100%;background:var(--d2);border:1px solid var(--b1);border-radius:6px;padding:8px 11px;font-size:12px;color:var(--t1);outline:0}
.pipe-logic-sel option{background:var(--d2)}
.pipe-col2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pipeline-ghost{opacity:.4;background:rgba(242,101,34,.08)!important;border:1px dashed var(--gold-dim)!important}
.pipeline-chosen{box-shadow:0 4px 20px rgba(242,101,34,.2)!important;transform:rotate(1deg) scale(1.01)!important}

/* SP-E: orden visual numérico para todos los steps del soporte */
.steps-inner [data-s="1"]  { order: 1; }
.steps-inner [data-s="2"]  { order: 2; }
.steps-inner [data-s="3"]  { order: 3; }
.steps-inner [data-s="4"]  { order: 4; }
.steps-inner [data-s="5"]  { order: 5; }
.steps-inner [data-s="6"]  { order: 6; }
.steps-inner [data-s="7"]  { order: 7; }
.steps-inner [data-s="8"]  { order: 8; }
.steps-inner [data-s="9"]  { order: 9; }
.steps-inner [data-s="10"] { order: 10; }
.steps-inner [data-s="11"] { order: 11; }
.steps-inner [data-s="16"] { order: 12; } /* Triggers entre Outreach y Pipeline */
.steps-inner [data-s="12"] { order: 13; } /* Pipeline */
.steps-inner [data-s="13"] { order: 14; }
.steps-inner [data-s="14"] { order: 15; }
.steps-inner [data-s="17"] { order: 16; } /* Fase 2C: Credenciales antes de Exportar */
.steps-inner [data-s="15"] { order: 17; } /* Exportar (bumped por el paso Credenciales) */

/* ===== SP-RESP: responsive movil (workflow) — solo @media, no toca desktop ===== */
/* ═══════════════════════════════════════════════════════
   Responsive móvil — Soporte exclusivo (pipeline modal)
   Solo lo propio de este vertical; el chrome vive en shared.css
════════════════════════════════════════════════════════ */
@media (max-width: 768px){
  /* Grid 2-col del modal pipeline -> 1 columna */
  .pipe-col2{grid-template-columns:1fr;gap:8px}

  /* Tabs del pipeline: que envuelvan en vez de desbordar en X */
  .pipe-tab-btn{padding:8px 12px;font-size:11px}

  /* Panel del pipeline: reducir padding para ganar ancho útil */
  .pipe-tab-panel{padding:12px}

  /* Inputs/selects a ancho completo y target táctil cómodo */
  .pipe-logic-input,
  .pipe-logic-sel{width:100%;max-width:100%;padding:10px 11px;font-size:12px}
}

@media (max-width: 480px){
  .pipe-tab-btn{padding:7px 10px;font-size:10.5px}
  .pipe-tab-panel{padding:10px}
  .pipe-col2{gap:6px}
}