/* GENERADO por scripts/leadz-generar-vistas.mjs desde vista-leadz-settings.js#CSS_SETTINGS + vista-leadz-settings.js#CSS_AJ_EQUIPO (vista settings, css). No se edita a mano. */

  /* El titulo del indice es un parrafo y no un h3: era el primer encabezado de la pagina, antes del h1 (PCB7A-18).
     Mismo aspecto que el h3 de .lz-sub en el cascaron. */
  .lz-sub__t { margin:0 0 4px; padding:0 10px; font-size:var(--fs-5); letter-spacing:-.01em; color:var(--text); font-weight:500; }
  .lz-sub__t + .lz-sub__g, .lz-sub__sum + .lz-sub__g { border-top:0; margin-top:0; padding-top:4px; }
  @media (max-width:820px) { .lz-sub__t { margin:0; padding:0 6px 0 0; white-space:nowrap; } }
  /* Apariencia salió de Ajustes (PCB9B-12): vive en Mi cuenta, con sus muestras. */
  /* El texto solo para lector de pantalla de las entradas del índice («, por conectar») es absoluto: sin un
     ancestro posicionado cae en el bloque contenedor inicial y ensanchaba la PÁGINA hasta 1349 px en
     390 (el índice es una tira que desplaza por dentro). El índice pasa a ser el contenedor. */
  @media (max-width:820px) { .lz-sub { position:relative; } }

  /* Estado: tarjetas de conexión en rejilla, con chip, una línea de estado y el botón a su sección. */
  html { scroll-padding-top:56px; }
  .lz-cx-sum { display:flex; align-items:center; gap:12px; flex-wrap:wrap; font-size:var(--fs-2); margin:-6px 0 14px; }
  .lz-cx-sum .lz-pto { margin-right:2px; }
  .lz-cx-g { font-size:var(--fs-3); font-weight:500; margin:0 0 10px; }
  .lz-cx-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:16px; max-width:900px; margin-bottom:16px; }
  .lz-cx { display:flex; flex-direction:column; gap:10px; }
  .lz-cx__h { display:flex; align-items:center; justify-content:space-between; gap:10px; }
  .lz-cx__h h3 { margin:0; font-size:var(--fs-4); font-weight:500; }
  .lz-cx p { font-size:var(--fs-2); margin:0; flex:1; }
  .lz-cx__a { display:flex; }
  /* Fila de usuario: el sucesor con ancho fijo para que las columnas cuadren, acciones que se
     apilan bajo 900 px en vez de desbordar la tarjeta, y el calendario como glifo del sistema. */
  .lz-u-acc .zinput.lz-suc { width:170px; flex:none; }
  .lz-u-acc { text-align:right; }
  .lz-u-acc form { display:flex; gap:10px; justify-content:flex-end; align-items:center; flex-wrap:wrap; }
  .lz-u-cal { display:inline-flex; align-items:center; vertical-align:middle; margin-left:4px; color:var(--text-muted); }
  .lz-u-cal .lz-glifo { width:12px; height:12px; }
  @media (max-width:900px) { .lz-u-acc { text-align:left; } .lz-u-acc form { justify-content:flex-start; } }
  /* Interruptor "Recibe leads": etiqueta visible junto al control (PCB-1441) y objetivo de 32/44 px. */
  .lz-nv { display:flex; flex-wrap:wrap; align-items:flex-end; gap:8px; margin-top:8px; }
  .lz-nv label { display:grid; gap:2px; margin:0; font-size:var(--fs-1); font-weight:500; color:var(--text-muted); }
  .lz-nv .zinput { width:auto; min-width:0; height:32px; padding:0 8px; font-size:var(--fs-2); }
  .lz-sw-form { display:inline-flex; align-items:center; gap:8px; }
  .lz-sw { display:inline-flex; align-items:center; gap:8px; min-height:32px; font-size:var(--fs-2); font-weight:400; color:var(--text-2); cursor:pointer; white-space:nowrap; }
  @media (pointer:coarse) { .lz-sw { min-height:44px; } }
  /* La bitácora del payload crudo. "pre-wrap" porque un JSON de proveedor trae líneas larguísimas
     y sin eso la tarjeta entera se estira y saca la pantalla de cuadro. */
  .lz-raw { border-top:1px solid var(--border); padding:8px 0; }
  .lz-raw summary { cursor:pointer; font-size:12.5px; }
  .lz-raw-pre { white-space:pre-wrap; word-break:break-word; font-family:var(--mono-code); font-variant-numeric:tabular-nums;
    font-size:11.5px; line-height:1.5; background:var(--surface-2); border:0;
    border-radius:var(--r-btn); padding:10px; margin:8px 0 0; max-height:340px; overflow:auto; }

  /* Editor de rubricas de Conversaciones. Cada renglon es su propio form: guardar un item no
     puede arrastrar los cambios sin guardar de los otros veinte. */
  .lz-rsec { border-top:1px solid var(--border); padding-top:12px; margin-top:14px; }
  .lz-rsec__h { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; flex-wrap:wrap; }
  .lz-rsec__f { display:inline-flex; align-items:center; gap:6px; margin:0; }
  /* el margen inferior global de label subía «obligatorio» 3 px sobre el eje de su campo */
  .lz-rsec__f > label { margin:0; }

  /* Google por asesor (15-oct, «esta tabla no cabe la info»): columnas fijas para que la acción nunca salga de la tarjeta,
     correos que parten donde haga falta y, en teléfono, cada renglón apilado. */
  .lz-gtab { width:100%; table-layout:fixed; border-collapse:separate; border-spacing:0; }
  .lz-gtab__c1 { width:38%; } .lz-gtab__c2 { width:auto; } .lz-gtab__c3 { width:156px; }
  .lz-gtab td { padding:12px 8px; vertical-align:middle; border-top:1px solid var(--hairline); overflow-wrap:anywhere; }
  .lz-gtab tr:first-child td { border-top:0; }
  .lz-gtab__n { display:block; color:var(--text); font-weight:500; }
  .lz-gtab__m { display:block; margin-top:2px; font-size:var(--fs-1); color:var(--text-muted); }
  .lz-gtab .mono { font-size:var(--fs-1); }
  .lz-gtab__acc { text-align:right; }
  .lz-gtab__acc .zbtn { white-space:nowrap; }
  .lz-gtab__aviso { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin:0 0 10px; font-size:var(--fs-2); color:var(--text-2); }
  @media (max-width:600px) {
    .lz-gtab, .lz-gtab tbody, .lz-gtab tr, .lz-gtab td { display:block; width:auto; }
    .lz-gtab colgroup { display:none; }
    .lz-gtab tr { padding:12px 0; border-top:1px solid var(--hairline); }
    .lz-gtab tr:first-child { border-top:0; }
    .lz-gtab td { padding:2px 0; border:0; }
    .lz-gtab td.lz-gtab__acc { text-align:left; padding-top:8px; }
  }
  .lz-et-list { display:flex; flex-direction:column; gap:8px; }
  .lz-et-row { display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid var(--hairline); border-radius:var(--r-control); background:var(--surface-anidada); flex-wrap:wrap; } /* módulo interno: ver .lz-modulo en panel-chrome.js */
  .lz-et-row--off .zinput { color:var(--text-2); }
  .lz-et-ord { display:flex; flex-direction:column; gap:2px; }
  .lz-et-ord form { margin:0; line-height:0; }
  /* Las flechas de orden del equipo medían 26 x 22 con el estilo del navegador, bajo el mínimo de 24 px de WCAG 2.5.8 (F2-19). */
  .lz-flecha { min-width:28px; min-height:28px; }
  .lz-et-arrow { width:28px; height:24px; border:1px solid var(--border); background:transparent; border-radius:var(--r-chip); cursor:pointer; font-size:11.5px; color:var(--text-muted); padding:0; }
  .lz-et-arrow:hover:not(:disabled) { color:var(--text); border-color:var(--text-muted); }
  .lz-et-arrow:disabled { opacity:.3; cursor:default; }
  .lz-et-edit { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0; flex:1; min-width:260px; }
  /* Selector de color (15-oct, Alex: «debería estar lleno el cuadro del color y tener algún icono de que es selector de color»).
     El contenedor es el control: borde de control, alto de campo y el foco en él por :focus-within (el input interno no
     dibuja anillo, regla de Alex). Dentro, el cuadro lleno del color de borde a borde (sin el marco gris del nativo) y el
     gotero de Lucide en --text-2, que dice que ahí se elige un color. */
  .lz-color { display:inline-flex; align-items:center; gap:6px; height:var(--h-control); margin:0; padding:0 10px 0 7px; box-sizing:border-box; flex:0 0 auto;
    border:1px solid var(--border-control); border-radius:var(--r-input); background:var(--surface); color:var(--text-2); cursor:pointer; }
  .lz-color input[type="color"] { -webkit-appearance:none; appearance:none; width:24px; height:24px; padding:0; margin:0; border:0;
    border-radius:calc(var(--r-input) - 3px); background:transparent; cursor:pointer; outline:none; box-shadow:none; }
  .lz-color input[type="color"]::-webkit-color-swatch-wrapper { padding:0; }
  .lz-color input[type="color"]::-webkit-color-swatch { border:0; border-radius:calc(var(--r-input) - 3px); box-shadow:inset 0 0 0 1px var(--hairline); }
  .lz-color input[type="color"]::-moz-color-swatch { border:0; border-radius:calc(var(--r-input) - 3px); box-shadow:inset 0 0 0 1px var(--hairline); }
  .lz-color .lz-glifo { width:16px; height:16px; }
  .lz-color:focus-within { box-shadow:var(--ring); border-color:var(--border-control); }
  @media (hover:hover) { .lz-color:hover { background:var(--surface-2); color:var(--text); } }
  .lz-et-nom { flex:1; min-width:110px; }
  .lz-et-cad { width:auto; min-width:130px; max-width:190px; }
  .lz-et-term { display:flex; align-items:center; gap:8px; margin:0 0 8px; flex-wrap:wrap; }
  .lz-et-meta { display:flex; align-items:center; gap:8px; margin-left:auto; }
  .lz-et-add { display:flex; align-items:center; gap:8px; margin-top:14px; flex-wrap:wrap; }
  .lz-et-add .zinput:not(.lz-et-cad) { flex:1; min-width:160px; }


      /* Sin opacity en el td: el aviso del reloj es hijo de esa celda y la opacidad del padre
         no se puede deshacer desde el hijo. Lo que se apaga es el texto, no el aviso. */
      .lz-baja td{color:var(--muted);}
      .lz-reloj{margin-top:8px;padding:9px 11px;border:1px solid var(--warn);border-radius:var(--r-control);
                background:var(--warn-soft);font-size:12px;line-height:1.55;color:var(--warn-text);}
      /* Reloj en orden: sin tinte de aviso, texto de apoyo. El aviso real lleva el par warn. */
      .lz-reloj.lz-ok{border-color:var(--border);background:none;color:var(--text-muted);}
