/* =====================================================================
   NETWISE · sistema visual
   Marca (netwisefreight.com): amarillo #fed835, gris carbón #262629,
   Montserrat (texto) y Bebas Neue (títulos y logo).
   Criterio: superficies claras y sobrias, el amarillo como acento
   (sección activa, foco, detalles) y la información secundaria adentro.
   ===================================================================== */
@font-face { font-family: "Montserrat"; font-weight: 100 900; font-display: swap; src: url(fuentes/montserrat.woff2) format("woff2"); }
@font-face { font-family: "Bebas Neue"; font-weight: 400; font-display: swap; src: url(fuentes/bebas-neue.woff2) format("woff2"); }

:root {
  --bg: #f5f5f3; --card: #fff; --text: #1b1b1e; --muted: #6b6b72; --suave: #9a9aa1;
  --border: #e4e2dc; --linea: #efede8; --superficie: #f3f2ee; --hover: #faf9f5;
  --carbon: #1f1f22; --primario: #262629; --primario-h: #3a3a3d;
  --amarillo: #fed835; --amarillo-h: #f5cc1a;
  --red: #c4000f; --red-bg: #fdecec; --orange: #9a5b00; --orange-bg: #fff7dc;
  --green: #0b6b4f; --green-bg: #e3f5ee;
  --radio: 8px;
  --sombra: 0 1px 2px rgba(20, 20, 25, .04);
  --fuente: "Montserrat", Arial, sans-serif;
  --fuente-titulos: "Bebas Neue", "Arial Narrow", sans-serif;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; font: 14px/1.5 var(--fuente); background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; }
input[type=radio], input[type=checkbox] { accent-color: var(--primario); }

/* ---------------------------------------------------------------- barra superior */
header { background: var(--carbon); color: #fff; min-height: 60px; padding: 0 28px; display: flex; align-items: center;
         justify-content: space-between; gap: 16px; flex-wrap: wrap; border-bottom: 3px solid var(--amarillo); }
.logo { display: inline-flex; flex-direction: column; line-height: 1; text-decoration: none; color: #fff; margin-right: 28px; padding: 10px 0; }
.logo .nombre { font-family: var(--fuente-titulos); font-size: 26px; letter-spacing: .12em; }
.logo .bajada { font-size: 8.5px; letter-spacing: .2em; color: #9a9aa1; margin-top: 3px; font-weight: 500; }
nav.menu { display: flex; align-items: stretch; flex-wrap: wrap; align-self: stretch; }
nav.menu a.item { display: flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 600; color: #d2d2d7; padding: 0 14px;
                  text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -3px; }
nav.menu a.item:hover { color: #fff; }
nav.menu a.item.activo { color: #fff; font-weight: 700; border-bottom-color: var(--amarillo); }
.item-chico { background: none; border: 0; font: inherit; font-size: 12.5px; font-weight: 600; color: #d2d2d7; padding: 6px 8px;
              border-radius: 6px; cursor: pointer; text-decoration: none; }
.item-chico:hover { color: #fff; background: rgba(255, 255, 255, .06); }

/* tipo de cambio BNA (encabezado, con conversor desplegable) */
/* Novedades: la campanita del encabezado, con las no leídas */
.cot-entrega { margin-top: 14px; }
/* Cotización: concepto de la lista, «Otro» con su detalle, seguro en % y «+ IVA» en lo que se paga en Argentina */
.cot-concepto { width: 100%; }
.tabla-items .solo-pct { display: none; align-items: center; gap: 3px; }
.tabla-items .es-seguro .solo-pct { display: inline-flex; }
.tabla-items .es-seguro .solo-cant { display: none; }
.tabla-items .solo-pct input { width: 60px; }
.tabla-items .es-otro [name=i_detalle] { border-color: var(--carbon); }
.cot-montos { display: inline-flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.cot-iva { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: var(--muted); font-weight: 500; white-space: nowrap; cursor: pointer; }
.cot-iva-monto { font-variant-numeric: tabular-nums; color: var(--text); }
.cot-valor { display: grid; grid-template-columns: auto 200px 1fr; gap: 4px 12px; align-items: center; margin: 0 0 12px; }
.cot-valor label { font-weight: 600; font-size: 13px; }
@media (max-width: 700px) { .cot-valor { grid-template-columns: 1fr; } }
/* Firmar la conformidad al aceptar una cotización */
.firma-dialogo { border: 0; border-radius: 14px; padding: 0; width: min(520px, calc(100vw - 32px)); box-shadow: 0 24px 60px rgba(20, 20, 25, .25); }
.firma-dialogo::backdrop { background: rgba(20, 20, 25, .45); }
.firma-dialogo form { padding: 24px 26px 20px; }
.firma-dialogo h2 { font-size: 18px; text-transform: none; letter-spacing: 0; color: var(--text); margin: 0 0 8px; }
.firma-dialogo p { font-size: 13px; color: var(--muted); margin: 0 0 14px; line-height: 1.5; }
.firma-ok { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; background: var(--superficie); border-radius: 8px; margin: 4px 0 16px;
            font-size: 13.5px; font-weight: 500; cursor: pointer; }
.firma-ok input { margin-top: 3px; }
.firma-acciones { display: flex; justify-content: flex-end; gap: 8px; }
/* Proyecto del importador: cuatro partes desplegables, en orden; «Mis cotizaciones» resaltada */
.imp-pasos { display: grid; gap: 12px; max-width: 980px; }
.imp-paso, .card.imp-paso { margin: 0; padding: 0; overflow: hidden; }
.imp-paso > summary, .imp-operar-fila { display: grid; grid-template-columns: 30px auto minmax(0, 1fr) 14px; gap: 14px; align-items: center;
                                        padding: 16px 20px; cursor: pointer; list-style: none; }
.imp-paso > summary::-webkit-details-marker { display: none; }
.imp-paso > summary:hover { background: var(--hover); }
.imp-n { width: 30px; height: 30px; border-radius: 50%; background: var(--carbon); color: var(--amarillo); display: inline-flex; align-items: center;
         justify-content: center; font-weight: 800; font-size: 13px; }
.imp-n-chico { background: var(--superficie); color: var(--muted); }
.imp-tit { font-weight: 700; font-size: 15px; white-space: nowrap; }
.imp-res { color: var(--muted); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.imp-flecha { width: 8px; height: 8px; border: solid var(--suave); border-width: 0 2px 2px 0; transform: rotate(45deg); transition: transform .15s; }
.imp-paso[open] > summary .imp-flecha { transform: rotate(-135deg); }
.imp-paso[open] > summary { border-bottom: 1px solid var(--linea); }
.imp-cuerpo { padding: 16px 20px 20px; }
.imp-paso.destacado { border-color: var(--carbon); box-shadow: inset 0 0 0 1px var(--carbon); }
.imp-paso.destacado .imp-n { background: var(--amarillo); color: var(--text); }
.imp-operar-fila { grid-template-columns: 30px minmax(0, 1fr) auto; cursor: default; }
.imp-operar-fila p { margin: 2px 0 0; font-size: 13px; color: var(--muted); }
.imp-editar { margin-top: 12px; max-width: 640px; }
.btn.apagado { opacity: .5; cursor: not-allowed; }
@media (max-width: 700px) {
  .imp-paso > summary { grid-template-columns: 30px minmax(0, 1fr) 14px; }
  .imp-res { grid-column: 2; grid-row: 2; white-space: normal; }
  .imp-operar-fila { grid-template-columns: 30px minmax(0, 1fr); }
  .imp-operar-fila > .btn { grid-column: 1 / -1; justify-self: start; }
}
/* Convertir en operación: el perfil a la izquierda, con quién sigue a la derecha */
.conv-grilla { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; align-items: start; max-width: 1080px; }
.conv-aviso { border-left: 4px solid var(--carbon); }
.conv-aviso.red { border-left-color: #1d4ed8; background: #f5f8ff; }
.conv-aviso h2 { font-size: 18px; text-transform: none; letter-spacing: 0; color: var(--text); margin: 6px 0 12px; }
.conv-aviso p { font-size: 14px; line-height: 1.6; margin: 0 0 10px; }
.conv-etq { font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
@media (max-width: 900px) { .conv-grilla { grid-template-columns: 1fr; } }
/* Cotizarle una oportunidad: lo que pide a la izquierda, las tres maneras a la derecha */
.cot-opor { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 20px; align-items: start; }
.cot-opor-vias { display: grid; gap: 12px; }
.cot-opor-vias > h2 { margin: 0; }
.cot-via { margin: 0; }
.cot-via h3 { margin: 0 0 6px; font-size: 15px; }
.cot-via p { margin: 0 0 12px; font-size: 13px; color: var(--muted); }
.cot-via.destacada { border-color: var(--carbon); box-shadow: inset 0 0 0 1px var(--carbon); }
@media (max-width: 900px) { .cot-opor { grid-template-columns: 1fr; } }
/* Cotización: los conceptos por grupo, con su subtotal */
#tabla-items th:nth-child(1) { width: 31%; } #tabla-items th:nth-child(2) { width: 31%; }
#tabla-items th:nth-child(3) { width: 9%; } #tabla-items th:nth-child(4) { width: 14%; }
.tabla-items tr.grupo-cab td { background: var(--superficie); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.tabla-items tr.grupo-cab td.subtotal-grupo { color: var(--text); font-size: 13px; letter-spacing: 0; }
.tabla-items tr.grupo-agregar td { padding-top: 4px; padding-bottom: 10px; }
.tabla-items tr.en-cero input { color: var(--suave); }
.cot-pide { margin: 0 0 6px; padding: 8px 12px; background: #fffbea; border-left: 3px solid var(--amarillo); border-radius: 0 6px 6px 0; font-size: 13px; }
.cot-entrega-opciones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 6px 0 10px; }
@media (max-width: 700px) { .cot-entrega-opciones { grid-template-columns: 1fr; } }
#campo-direccion input { width: 100%; }
.cot-alcances { display: grid; gap: 6px; margin: 6px 0 6px; }
.cot-alcances label { display: flex; align-items: flex-start; gap: 8px; font-weight: 600; font-size: 13px; }
.cot-alcances label input { margin-top: 3px; }
.cot-alcances small { display: block; font-weight: 400; color: var(--muted); font-size: 12px; }
.cot-etq { display: block; font-weight: 700; font-size: 13px; }
.cot-consentimiento { display: flex; gap: 10px; align-items: flex-start; margin-top: 12px; padding: 12px 14px; border-radius: 8px; background: var(--superficie);
                      font-size: 13px; font-weight: 500; line-height: 1.5; cursor: pointer; }
.cot-consentimiento input { margin-top: 3px; flex: none; }
.campana { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%;
           color: #c9c9ce; transition: background .15s, color .15s; }
.campana:hover, .campana.activo { background: #2f2f33; color: #fff; }
.campana svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.campana-cuenta { position: absolute; top: 1px; right: -2px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 999px; background: var(--amarillo);
                  color: var(--text); font-size: 10px; font-weight: 800; line-height: 17px; text-align: center; }
.avisos, .avisos.card { margin: 0; padding: 0; max-width: 900px; overflow: hidden; }
.nov + .nov { border-top: 1px solid var(--linea); }
.nov > summary { display: grid; grid-template-columns: 110px minmax(0, 1fr) auto 12px; gap: 16px; align-items: center;
                   padding: 13px 20px 13px 17px; border-left: 3px solid transparent; cursor: pointer; list-style: none; color: var(--muted); }
.nov > summary::-webkit-details-marker { display: none; }
.nov > summary:hover { background: var(--hover); }
.nov.sin-leer > summary { border-left-color: var(--carbon); color: var(--text); }
.nov.sin-leer .nov-titulo { font-weight: 700; }
.nov-tipo { font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--suave); white-space: nowrap; }
.nov-titulo { font-size: 14px; overflow-wrap: anywhere; }
.nov-fecha { font-size: 12px; color: var(--suave); white-space: nowrap; font-variant-numeric: tabular-nums; }
.nov-flecha { width: 7px; height: 7px; border: solid var(--suave); border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); transition: transform .15s; }
.nov[open] .nov-flecha { transform: rotate(-135deg); }
.nov[open] > summary { background: var(--superficie); }
.nov-cuerpo { padding: 16px 20px 18px 146px; display: grid; gap: 14px; justify-items: start; background: var(--superficie);
                border-top: 1px solid var(--linea); }
.nov-datos { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 7px 20px; margin: 0; font-size: 13px; }
.nov-datos dt { color: var(--muted); }
.nov-datos dd { margin: 0; color: var(--text); overflow-wrap: anywhere; }
.nov-datos dd.solo { grid-column: 1 / -1; }
.nov-ir { font-size: 13px; font-weight: 600; color: var(--text); text-decoration: none; border-bottom: 1px solid var(--border); padding-bottom: 1px; }
.nov-ir:hover { border-bottom-color: var(--text); }
@media (max-width: 700px) {
  .nov > summary { grid-template-columns: minmax(0, 1fr) 12px; gap: 4px 12px; padding: 12px 14px 12px 11px; }
  .nov-tipo { grid-column: 1; grid-row: 1; }
  .nov-titulo { grid-column: 1; grid-row: 2; }
  .nov-fecha { grid-column: 1; grid-row: 3; }
  .nov-flecha { grid-column: 2; grid-row: 1 / 4; }
  .nov-cuerpo { padding: 14px; }
  .nov-datos { grid-template-columns: 1fr; gap: 2px; }
  .nov-datos dd { margin-bottom: 8px; }
}
.tc-menu { position: relative; }
.tc-menu > summary { list-style: none; cursor: pointer; }
.tc-menu > summary::-webkit-details-marker { display: none; }
.tc { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: #fff;
      background: #2d2d31; padding: 6px 12px; border-radius: 999px; white-space: nowrap; }
.tc:hover, .tc-menu[open] .tc { background: #3a3a3f; }
.tc-etq { font-size: 10px; letter-spacing: .1em; color: var(--amarillo); }
.tc-panel { position: absolute; right: 0; top: calc(100% + 10px); z-index: 20; width: 320px; background: var(--card); color: var(--text);
            border: 1px solid var(--border); border-radius: var(--radio); box-shadow: 0 12px 32px rgba(0, 0, 0, .18); padding: 16px; }
.tc-panel table { border: 0; margin-bottom: 12px; }
.tc-panel th, .tc-panel td { padding: 6px 4px; background: none; }
.tc-panel tbody tr { cursor: default; }
.tc-panel tbody tr:hover td { background: none; }
.tc-panel .conversor-fila { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.tc-panel .conversor-fila > div:last-child { grid-column: span 2; }
.tc-panel .fuente { font-size: 11.5px; color: var(--muted); margin-top: 10px; }
em.ars { font-style: normal; }
em.ars:empty { display: none; }

/* ---------------------------------------------------------------- estructura */
main { max-width: 1240px; margin: 32px auto 48px; padding: 0 24px; }
main.angosto { max-width: 880px; }
h1, h2, h3 { margin: 0; }
h1 { font-family: var(--fuente-titulos); font-weight: 400; font-size: 32px; letter-spacing: .03em; line-height: 1.05; }
h2 { font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .09em; color: var(--muted); margin: 0 0 14px; }
h3 { font-size: 13px; font-weight: 600; }
a { color: var(--text); text-decoration-color: var(--amarillo); text-decoration-thickness: 2px; text-underline-offset: 3px; }
a:hover { text-decoration-color: var(--primario); }
:focus-visible { outline: 3px solid var(--amarillo); outline-offset: 2px; }
.muted { color: var(--muted); font-size: 12.5px; }

/* encabezado de cada página: migas + título + subtítulo + acciones */
.barra { display: flex; gap: 12px 20px; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; margin-bottom: 20px; }
.migas { font-size: 12.5px; font-weight: 500; color: var(--muted); margin: 0 0 6px; }
.migas a { color: var(--muted); text-decoration: none; }
.migas a:hover { color: var(--text); }
.subtitulo { color: var(--muted); font-size: 13px; margin-top: 6px; }
.subtitulo strong { color: var(--text); font-weight: 600; }
.acciones { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

.card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radio); padding: 22px 24px; margin-bottom: 20px; box-shadow: var(--sombra); }
.card.plano { padding: 0; overflow: hidden; }
.vacio { text-align: center; padding: 48px 20px; color: var(--muted); }

/* ---------------------------------------------------------------- botones y formularios */
.btn { white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; background: var(--primario); color: #fafaf9;
       border: 1px solid var(--primario); border-radius: 6px; padding: 8px 15px; font: inherit; font-size: 13.5px; font-weight: 600;
       cursor: pointer; text-decoration: none; line-height: 1.3; }
.btn:hover { background: var(--primario-h); }
.btn.amarillo { background: var(--amarillo); color: var(--text); border-color: var(--amarillo); }
.btn.amarillo:hover { background: var(--amarillo-h); }
.btn.secundario { background: #fff; color: var(--text); border-color: var(--border); }
.btn.secundario:hover { background: var(--superficie); }
.btn.peligro { background: #fff; color: var(--red); border-color: #f1caca; }
.btn.peligro:hover { background: var(--red-bg); }
.btn.ok { background: #047857; border-color: #047857; }
.btn.ok:hover { background: #065f46; }
.btn.chico { padding: 5px 11px; font-size: 12.5px; }
.link-accion { background: none; border: 0; padding: 0; font: inherit; font-size: 12.5px; color: var(--muted); cursor: pointer; text-decoration: underline;
               text-decoration-color: var(--border); text-underline-offset: 3px; }
.link-accion:hover { color: var(--text); text-decoration-color: var(--amarillo); }
label { display: block; font-size: 12px; font-weight: 600; color: var(--muted); margin-bottom: 5px; }
input[type=text], input[type=email], input[type=tel], input[type=search], input[type=date], input[type=number], input[type=password], select, textarea {
  width: 100%; padding: 8px 11px; border: 1px solid var(--border); border-radius: 6px; font: inherit; font-size: 14px; background: #fff; color: var(--text);
}
input:hover, select:hover, textarea:hover { border-color: #d3d0c8; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--primario); box-shadow: 0 0 0 3px rgba(254, 216, 53, .5); }
input:disabled, select:disabled, textarea:disabled { background: var(--bg); color: var(--text); }
textarea { resize: vertical; min-height: 72px; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-bottom: 16px; }
.campo { margin-bottom: 16px; }
.error, .aviso, .exito { padding: 11px 14px; border-radius: 6px; margin-bottom: 16px; font-size: 13.5px; border: 1px solid transparent; }
.error { background: var(--red-bg); color: var(--red); border-color: #f6d4d4; }
.aviso { background: var(--orange-bg); color: var(--orange); border-color: #f5e3a8; }
.exito { background: var(--green-bg); color: var(--green); border-color: #c8eadc; }
.error ul, .aviso ul { margin: 6px 0 0; padding-left: 20px; }

/* ---------------------------------------------------------------- pestañas y filtros */
.filtros { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.filtros a { padding: 8px 0; text-decoration: none; color: #55555c; font-size: 13.5px; font-weight: 600; border-bottom: 2px solid transparent; }
.filtros a:hover { color: var(--text); }
.filtros a.activo { color: var(--text); font-weight: 700; border-bottom-color: var(--amarillo); }
.filtros .cuenta { color: var(--suave); font-weight: 500; margin-left: 4px; }
.herramientas { display: flex; align-items: center; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap;
                border-bottom: 1px solid var(--border); margin-bottom: 18px; }
.herramientas .controles { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
.herramientas select, .herramientas input[type=text] { width: auto; padding: 6px 10px; font-size: 13px; }
.buscar { min-width: 220px; }
.pestanas { display: flex; gap: 24px; border-bottom: 1px solid var(--border); margin-bottom: 20px; flex-wrap: wrap; }
.pestanas button { background: none; border: 0; font: inherit; font-size: 13.5px; font-weight: 600; color: #55555c; padding: 10px 0;
                   border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; }
.pestanas button:hover { color: var(--text); }
.pestanas button.activa { color: var(--text); font-weight: 700; border-bottom-color: var(--amarillo); }
.pestanas .cuenta { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 6px; border-radius: 9px; background: var(--superficie);
                    color: var(--muted); font-size: 11px; font-weight: 600; text-align: center; }

/* ---------------------------------------------------------------- tablas */
.tabla-scroll { overflow-x: auto; background: var(--card); border: 1px solid var(--border); border-radius: var(--radio); box-shadow: var(--sombra); }
table { width: 100%; border-collapse: collapse; }
.tabla-scroll table, .card table { border: 0; }
th { text-align: left; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .07em; color: var(--muted);
     background: #fafaf8; padding: 11px 16px; border-bottom: 1px solid var(--border); white-space: nowrap; }
td { padding: 13px 16px; border-bottom: 1px solid var(--linea); vertical-align: top; }
tr:last-child td { border-bottom: 0; }
tbody tr { cursor: pointer; }
tbody tr:hover td { background: var(--hover); }
td.nombre a { font-weight: 600; text-decoration: none; color: var(--text); }
td.nombre a:hover { text-decoration: underline; text-decoration-color: var(--amarillo); }
.meta { color: var(--muted); font-size: 12.5px; margin-top: 2px; }
.fecha { white-space: nowrap; font-variant-numeric: tabular-nums; }
.vencida { color: var(--red); font-weight: 600; }
.es-hoy { color: var(--orange); font-weight: 600; }
tr.fila-vencida td:first-child { box-shadow: inset 3px 0 0 var(--red); }
tr.fila-hoy td:first-child { box-shadow: inset 3px 0 0 var(--amarillo); }
tr.cerrada td { color: var(--muted); }
th.num, td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
input.num { text-align: right; }
.texto-corto { max-width: 360px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nota-corta { color: var(--muted); font-size: 12.5px; max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.accion-corta { font-size: 13px; max-width: 260px; }
.responsable { font-size: 12px; color: var(--muted); margin-top: 2px; }
.alerta { color: var(--orange); font-size: 12px; font-weight: 600; }
.negativo { color: var(--red) !important; }
.bien { color: var(--green); font-weight: 600; }
.mal { color: var(--red) !important; font-weight: 600; }

/* ---------------------------------------------------------------- estados: punto de color + texto */
.badge { display: inline-flex; align-items: center; gap: 7px; font-family: var(--fuente); font-size: 12.5px; font-weight: 500;
         color: var(--text); white-space: nowrap; letter-spacing: 0; text-transform: none; vertical-align: middle; }
.badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--c, #a8a8ae); flex: none; }
.badge.chip, .badge.modalidad { background: var(--superficie); border-radius: 999px; padding: 2px 10px; font-size: 12px; }
.badge.modalidad::before { display: none; }
h1 .badge { margin-left: 10px; font-size: 13px; }
.e0 { --c: #6b6bd6; } .e1 { --c: #e3a008; } .e2 { --c: #e0533d; } .e3 { --c: #8b5cf6; }
.e4 { --c: #12a36b; } .e5 { --c: #1593c9; } .e6 { --c: #a8a8ae; }
.p0 { --c: #6b6bd6; } .p1 { --c: #1593c9; } .p2 { --c: #e3a008; } .p3 { --c: #8b5cf6; } .p4 { --c: #12a36b; } .p5 { --c: #a8a8ae; }
.s-pendiente { --c: #a8a8ae; } .s-borrador { --c: #e3a008; } .s-aceptada { --c: #12a36b; } .s-modificada { --c: #e0533d; }

/* ---------------------------------------------------------------- indicadores (KPI) */
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1px; background: var(--linea);
         border: 1px solid var(--border); border-radius: var(--radio); overflow: hidden; margin-bottom: 20px; box-shadow: var(--sombra); }
.tile { background: var(--card); padding: 16px 20px; }
.tile > span { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 600; }
.tile > strong { display: block; font-size: 22px; font-weight: 600; margin-top: 6px; letter-spacing: -.01em; }
.tile > em { display: block; font-style: normal; font-size: 12px; color: var(--muted); margin-top: 2px; }
.tile.destacado { box-shadow: inset 0 3px 0 var(--amarillo); }
.tiles.compactas .tile { padding: 12px 16px; }
.tiles.compactas .tile > strong { font-size: 17px; }
/* franja de datos clave en la ficha de la operación (cada celda lleva a su sección) */
a.tile { text-decoration: none; color: inherit; }
a.tile:hover { background: var(--hover); }
a.tile > em.ir { color: var(--text); font-weight: 600; }

/* ---------------------------------------------------------------- resumen operativo */
.resumen { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--linea);
           border: 1px solid var(--border); border-radius: var(--radio); overflow: hidden; }
.resumen .dato { background: var(--card); padding: 16px 20px; }
.resumen .dato > span { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 600; margin-bottom: 6px; }
.resumen .dato strong { font-size: 17px; font-weight: 600; }
.resumen .dato strong .badge { font-family: var(--fuente); }

/* ---------------------------------------------------------------- ficha de operación */
.detalle-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
@media (max-width: 900px) { .detalle-layout { grid-template-columns: 1fr; } }
.panel { display: none; }
.panel.activo { display: block; }
.historial { list-style: none; margin: 0; padding: 0; }
.historial li { padding: 12px 0; border-bottom: 1px solid var(--linea); display: grid; grid-template-columns: 130px 1fr; gap: 12px; }
.historial li:last-child { border-bottom: 0; }
.historial .cuando { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
.historial .texto { white-space: pre-wrap; }
.historial li.sistema .texto { color: var(--muted); font-size: 13px; }
.nota-nueva { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 8px; }
.nota-nueva textarea { min-height: 42px; }
.link-copiar { display: flex; gap: 8px; }
.link-copiar input { font-size: 12.5px; font-family: Consolas, monospace; background: var(--bg); }
details.desplegable > summary { cursor: pointer; list-style: none; display: inline-flex; }
details.desplegable > summary::-webkit-details-marker { display: none; }
details.desplegable[open] > summary { margin-bottom: 16px; }
.zona-peligro { border-top: 1px solid var(--linea); margin-top: 22px; padding-top: 18px; display: flex; justify-content: space-between;
                align-items: center; gap: 12px; flex-wrap: wrap; }

/* tareas */
ul.tareas { list-style: none; margin: 0 0 14px; padding: 0; }
ul.tareas li { display: flex; gap: 12px; align-items: flex-start; padding: 11px 0; border-bottom: 1px solid var(--linea); }
ul.tareas li:last-child { border-bottom: 0; }
.tarea-cuerpo { flex: 1; min-width: 0; }
.tarea-cuerpo .muted { font-size: 12px; margin-top: 1px; }
button.check, span.check { width: 22px; height: 22px; flex: none; border-radius: 50%; border: 1.5px solid #cfccc4; background: #fff;
       color: transparent; font-weight: 700; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
       padding: 0; font-size: 12px; margin-top: 1px; }
button.check:hover { border-color: #047857; color: #047857; }
.check.hecho { background: #047857; border-color: #047857; color: #fff; }
li.hecha .tarea-cuerpo { color: var(--muted); }
.tarea-nueva { display: flex; gap: 8px; flex-wrap: wrap; padding-top: 14px; border-top: 1px solid var(--linea); }
.tarea-nueva input[type=text] { flex: 1 1 240px; width: auto; }
.tarea-nueva input[type=date] { flex: 0 1 150px; width: auto; }
.tarea-nueva select { flex: 1 1 200px; width: auto; }
details.hechas { margin-top: 16px; }
details.hechas summary { cursor: pointer; font-size: 12.5px; color: var(--muted); }
.link-quitar { background: none; border: 0; color: var(--suave); cursor: pointer; font-size: 12px; padding: 3px 6px; border-radius: 4px; }
.link-quitar:hover { background: var(--red-bg); color: var(--red); }

/* documentos */
.docs-tabla td { vertical-align: middle; padding: 10px 16px; }
.docs-tabla tbody tr { cursor: default; }
.docs-tabla form { margin: 0; }
.doc-subir { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; padding-top: 16px; }
.doc-subir select { width: auto; }
.doc-subir input[type=file] { font-size: 12.5px; flex: 1 1 220px; min-width: 0; }
.doc-subir input[type=text] { flex: 1 1 180px; width: auto; }
.docs-faltan { font-size: 12.5px; color: var(--muted); margin: 0 0 14px; }
.docs-mini { display: flex; gap: 4px; }
.docs-mini span { font-size: 11px; font-weight: 600; padding: 1px 6px; border-radius: 4px; background: var(--superficie); color: var(--suave); }
.docs-mini span.tiene { background: var(--green-bg); color: var(--green); }

/* ---------------------------------------------------------------- formulario de solicitud */
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.req { color: var(--red); }
.opciones { display: flex; gap: 18px; flex-wrap: wrap; padding: 6px 0; }
label.opcion { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 400; color: var(--text); margin: 0; cursor: pointer; }
label.opcion input { margin: 0; width: 16px; height: 16px; }
.condicional { border-left: 2px solid var(--amarillo); padding-left: 14px; margin-left: 2px; }
.archivo-actual { font-size: 13.5px; margin-bottom: 6px; }
.con-unidad { display: flex; gap: 8px; }
.con-unidad select { width: 90px; flex: none; }
.conformidad { border-top: 3px solid var(--amarillo); }
.conformidad label.opcion { align-items: flex-start; font-size: 14px; }
.conformidad label.opcion input { margin-top: 3px; flex: none; }
.intro { font-size: 14.5px; }
.aviso-modalidad { font-size: 13px; color: var(--muted); margin: 0 0 16px; }
.campo.cambiado { background: var(--orange-bg); border-left: 3px solid #f0b429; padding: 8px 10px; border-radius: 6px; }
.antes { font-size: 12px; color: var(--orange); margin-top: 4px; }
.aviso s { opacity: .75; }

/* ficha de condiciones (resumen y vista del cliente) */
.ficha { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 8px 40px; }
.ficha h3 { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--text);
            margin: 14px 0 8px; padding-bottom: 6px; border-bottom: 2px solid var(--amarillo); display: inline-block; }
.ficha section { min-width: 0; }
.ficha dl { display: grid; grid-template-columns: minmax(130px, 45%) 1fr; gap: 7px 14px; margin: 0; font-size: 13.5px; }
.ficha dt { color: var(--muted); }
.ficha dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.ficha dd.falta { color: var(--suave); font-weight: 400; }
details.condiciones summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 8px; }
details.condiciones summary::-webkit-details-marker { display: none; }
details.condiciones summary::after { content: "Ver"; font-size: 12.5px; font-weight: 600; color: var(--muted); margin-left: auto; }
details.condiciones[open] summary::after { content: "Ocultar"; }
details.condiciones summary h2 { margin: 0; }
details.condiciones[open] summary { margin-bottom: 8px; }
.lista-docs { list-style: none; margin: 0; padding: 0; }
.lista-docs li { display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; padding: 10px 0; border-bottom: 1px solid var(--linea); }
.lista-docs li:last-child { border-bottom: 0; }
.lista-docs .muted { min-width: 150px; }

/* ---------------------------------------------------------------- finanzas */
.tabla-costos td { padding: 6px 8px; vertical-align: middle; border-bottom: 1px solid var(--linea); }
.tabla-costos tbody tr { cursor: default; }
.tabla-costos tbody tr:hover td { background: none; }
.tabla-costos input { padding: 6px 9px; }
.tabla-costos td:nth-child(3), .tabla-costos td:nth-child(4) { width: 130px; }
.tabla-costos tfoot td { border-top: 1px solid var(--border); border-bottom: 0; padding-top: 12px; }
.celda-proveedor { position: relative; }
.celda-proveedor .ver-agente { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); text-decoration: none; font-size: 12px; }
tr.historica td { color: var(--muted); }
.graficos { display: grid; grid-template-columns: 3fr 2fr; gap: 20px; }
@media (max-width: 900px) { .graficos { grid-template-columns: 1fr; } }
.columnas { position: relative; height: 200px; display: flex; gap: 4px; align-items: stretch; margin: 30px 0 30px 40px; }
.columnas .eje-y { position: absolute; left: -40px; top: 0; bottom: 0; width: 34px; }
.columnas .eje-y span { position: absolute; right: 0; transform: translateY(50%); font-size: 11px; color: var(--muted); font-variant-numeric: tabular-nums; }
.columnas .linea-base { position: absolute; left: 0; right: 0; bottom: var(--base); border-top: 1px solid var(--border); }
.columnas .col { position: relative; flex: 1; display: flex; justify-content: center; }
.barra-col { position: absolute; width: min(22px, 70%); background: var(--primario); border-radius: 4px 4px 0 0; outline: none; }
.barra-col.neg { background: var(--red); border-radius: 0 0 4px 4px; }
.barra-col::before { content: ""; position: absolute; inset: -6px -8px; }
.valor-tope { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: 4px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.etiqueta-mes { position: absolute; top: 100%; margin-top: 8px; font-size: 11px; color: var(--muted); white-space: nowrap; }
.tip { display: none; position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%); z-index: 5;
       background: var(--carbon); color: #fafaf9; font-size: 12px; line-height: 1.5; padding: 8px 11px; border-radius: 6px; white-space: nowrap; pointer-events: none; }
.barra-col:hover .tip, .barra-col:focus .tip { display: block; }
.barra-col.neg .tip { bottom: auto; top: calc(100% + 8px); }
.ranking td { padding: 10px 4px; vertical-align: middle; border-bottom: 1px solid var(--linea); }
.ranking tr { cursor: default; }
.ranking tr:hover td { background: none; }
.rk-nombre { width: 42%; font-weight: 600; font-size: 13.5px; }
.rk-nombre .muted { font-weight: 400; }
.rk-barra { display: flex; align-items: center; gap: 8px; }
.barra-h { height: 12px; min-width: 2px; background: var(--primario); border-radius: 0 4px 4px 0; }
.barra-h.neg { background: var(--red); }
.rk-valor { font-size: 12.5px; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.conversor-fila { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; }
.conversor-fila > div { flex: 1 1 140px; }

/* ---------------------------------------------------------------- agentes */
ul.personas { list-style: none; margin: 0 0 16px; padding: 0; }
ul.personas li { padding: 10px 0; border-bottom: 1px solid var(--linea); }
.persona-nueva h3 { margin: 12px 0 12px; }

/* ---------------------------------------------------------------- impresión */
@media print {
  header, .no-print, .pestanas { display: none !important; }
  body { background: #fff; }
  .card, .tiles, .tabla-scroll { box-shadow: none; break-inside: avoid; }
  main { margin: 0; }
  .panel { display: block !important; }
  details.condiciones > .ficha { display: grid !important; }
}
@media (max-width: 700px) {
  header { padding: 0 16px; }
  main { padding: 0 16px; margin-top: 20px; }
  .historial li { grid-template-columns: 1fr; gap: 2px; }
  .resumen { grid-template-columns: 1fr 1fr; }
}

/* ficha de contacto (agentes y personas) */
.ficha-contacto { display: grid; grid-template-columns: 110px 1fr; gap: 8px 14px; margin: 0 0 18px; font-size: 13.5px; }
.ficha-contacto dt { color: var(--muted); }
.ficha-contacto dd { margin: 0; overflow-wrap: anywhere; }

/* tarifas de mercado: "informada por" editable en la tabla */
.fuente-editable { margin: 0; }
.fuente-editable input { border-color: transparent; background: transparent; padding: 4px 8px; font-size: 13px; min-width: 180px; }
.fuente-editable input:hover { border-color: var(--border); background: #fff; }
.fuente-editable input:focus { background: #fff; }

/* comparación mercado vs. tarifas utilizadas */
.grupo-comparacion { margin-bottom: 16px; }
.grupo-titulo { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap;
                padding: 14px 18px; border-bottom: 1px solid var(--border); font-size: 14px; }
.tabla-comparacion tbody tr { cursor: default; }
.tabla-comparacion td { padding: 10px 18px; }
.tabla-comparacion th { padding: 9px 18px; }

/* menú: contador de tareas urgentes */
.menu-cuenta { display: inline-block; min-width: 18px; padding: 0 5px; border-radius: 9px; background: var(--amarillo);
               color: var(--text); font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; }

/* operaciones: ETA dentro de los próximos 7 días */
.eta-pronto { color: var(--red); font-weight: 600; }
.pill-pronto { display: inline-block; margin-top: 4px; padding: 1px 8px; border-radius: 999px; background: var(--red-bg);
               color: var(--red); font-size: 11px; font-weight: 600; }

/* tareas */
.tarea-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; font-size: 12px; color: var(--muted); margin-top: 2px; }
.chip-yo { display: inline-block; padding: 0 7px; border-radius: 4px; background: var(--amarillo); color: var(--text);
           font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; line-height: 17px; }
.chip-op { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom;
           padding: 0 7px; border-radius: 4px; background: var(--superficie); color: var(--text); text-decoration: none; line-height: 18px; }
.chip-op:hover { background: #e9e7e1; }
.tablero-tareas { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 16px; align-items: start; }
/* Cada tarea ocupa una fila compartida con las tarjetas vecinas: si una tarea tiene
   más texto, la de al lado se estira para quedar del mismo alto. */
@supports (grid-template-rows: subgrid) {
  .tablero-tareas[style*="--filas"] > .grupo-tareas { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: subgrid; grid-row: span var(--filas); row-gap: 0; align-self: stretch; align-content: start; }
  .tablero-tareas[style*="--filas"] > .grupo-tareas > ul.tareas { display: contents; }
}
.agentes-tareas { display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: 16px; align-items: start; }
.grupo-tareas { margin-bottom: 0; padding: 18px 20px 8px; }
.grupo-tareas h2 { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.grupo-tareas h2 a { color: inherit; text-decoration: none; }
.cuenta-grupo { min-width: 20px; padding: 0 6px; border-radius: 10px; background: var(--superficie); color: var(--muted);
                font-size: 11px; text-align: center; letter-spacing: 0; }
.grupo-vencidas { border-top: 3px solid var(--red); }
.grupo-vencidas h2 { color: var(--red); }
.grupo-hoy { border-top: 3px solid var(--amarillo); }
.panel > .hechas { margin-top: 16px; }
details.hechas.card { padding: 14px 20px; }

/* formulario de tarea */
.tarea-nueva-card { border-top: 3px solid var(--amarillo); }
.tarea-form .tf-fila { margin-bottom: 12px; }
.tarea-form .tf-fila:last-child { margin-bottom: 0; }
.tarea-form input[name=descripcion] { font-size: 15px; padding: 10px 12px; }
.tf-opciones { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: flex-start; }
.tf-campo { display: flex; flex-direction: column; }
.tf-ancho { flex: 1 1 200px; min-width: 180px; }
.tf-boton { align-self: flex-end; padding-bottom: 22px; }
.segmentado { display: inline-flex; border: 1px solid var(--border); border-radius: 6px; overflow: hidden; background: #fff; }
.segmentado label { margin: 0; cursor: pointer; }
.segmentado input { position: absolute; opacity: 0; pointer-events: none; }
.segmentado span { display: block; padding: 8px 14px; font-size: 13.5px; font-weight: 600; color: #55555c; }
.segmentado label + label span { border-left: 1px solid var(--border); }
.segmentado input:checked + span { background: var(--primario); color: #fff; }
.segmentado input:focus-visible + span { outline: 3px solid var(--amarillo); outline-offset: -3px; }
.atajos-fecha { display: flex; gap: 4px; margin-top: 5px; }
.atajos-fecha button { background: var(--superficie); border: 0; border-radius: 4px; padding: 2px 8px; font: inherit; font-size: 11.5px;
                       font-weight: 600; color: var(--muted); cursor: pointer; }
.atajos-fecha button:hover { background: #e9e7e1; color: var(--text); }
#panel-tareas .tarea-form { border-top: 1px solid var(--linea); padding-top: 16px; }

/* rango de tarifa de mercado (comparación) */
.rango-form { display: flex; align-items: center; gap: 8px; margin: 0; }
.rango-form label { margin: 0; font-size: 13px; color: var(--text); }
.rango-form input { width: 90px; text-align: right; padding: 6px 9px; }

/* selector múltiple de operaciones (tareas) */
details.multi { position: relative; }
details.multi > summary { list-style: none; cursor: pointer; padding: 8px 32px 8px 11px; border: 1px solid var(--border); border-radius: 6px;
                          background: #fff; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: relative; }
details.multi > summary::-webkit-details-marker { display: none; }
details.multi > summary::after { content: "▾"; position: absolute; right: 11px; top: 50%; transform: translateY(-50%); color: var(--muted); }
details.multi[open] > summary { border-color: var(--primario); box-shadow: 0 0 0 3px rgba(254, 216, 53, .5); }
.multi-panel { position: absolute; z-index: 15; left: 0; right: 0; min-width: 260px; top: calc(100% + 6px); background: #fff;
               border: 1px solid var(--border); border-radius: var(--radio); box-shadow: 0 12px 28px rgba(0, 0, 0, .14); padding: 10px; }
.multi-panel [data-buscar] { margin-bottom: 8px; padding: 6px 9px; font-size: 13px; }
.multi-lista { max-height: 220px; overflow-y: auto; }
.multi-lista label { display: flex; align-items: center; gap: 8px; padding: 6px 6px; margin: 0; border-radius: 4px; font-size: 13.5px;
                     font-weight: 500; color: var(--text); cursor: pointer; }
.multi-lista label:hover { background: var(--hover); }
.multi-lista input { width: 15px; height: 15px; margin: 0; }
.multi-pie { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--linea); margin-top: 8px; padding-top: 8px; }

/* agentes: carpetas por actividad */
details.carpeta { background: var(--card); border: 1px solid var(--border); border-radius: var(--radio); box-shadow: var(--sombra);
                  margin-bottom: 14px; overflow: hidden; scroll-margin-top: 16px; }
details.carpeta > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; padding: 14px 18px; }
details.carpeta > summary::-webkit-details-marker { display: none; }
details.carpeta > summary:hover { background: var(--hover); }
details.carpeta[open] > summary { border-bottom: 1px solid var(--border); }
.carpeta-icono { width: 18px; height: 14px; border-radius: 2px 3px 3px 3px; background: var(--amarillo); position: relative; flex: none; }
.carpeta-icono::before { content: ""; position: absolute; left: 0; top: -3px; width: 8px; height: 4px; border-radius: 2px 2px 0 0; background: var(--amarillo); }
details.carpeta:not([open]) .carpeta-icono { background: #e9d27a; }
.carpeta-nombre { font-weight: 700; font-size: 14.5px; }
.carpeta-agregar { margin-left: auto; }
details.carpeta table th { background: #fafaf8; }
.carpeta-vacia { margin: 0; padding: 16px 18px; }

/* contraseña de Finanzas */
.clave-finanzas { max-width: 380px; margin: 60px auto; border-top: 3px solid var(--amarillo); }
.candado { width: 22px; height: 16px; background: var(--primario); border-radius: 3px; position: relative; margin: 10px 0 16px; }
.candado::before { content: ""; position: absolute; left: 4px; top: -10px; width: 10px; height: 12px; border: 2px solid var(--primario);
                   border-bottom: 0; border-radius: 7px 7px 0 0; }
.menu-candado { width: 9px; height: 7px; background: currentColor; border-radius: 1.5px; position: relative; margin-left: 2px; opacity: .8; }
.menu-candado::before { content: ""; position: absolute; left: 1.5px; top: -5px; width: 3px; height: 5px; border: 1.5px solid currentColor;
                        border-bottom: 0; border-radius: 3px 3px 0 0; }

/* agentes: tarjetas de categoría */
.categorias { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin-bottom: 22px; }
.categoria { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; text-align: left; font: inherit; cursor: pointer;
             background: var(--card); border: 1px solid var(--border); border-radius: var(--radio); padding: 18px 20px; box-shadow: var(--sombra);
             transition: border-color .15s, box-shadow .15s; }
.categoria:hover { border-color: #cfccc4; box-shadow: 0 4px 14px rgba(20, 20, 25, .07); }
.categoria.activa { border-color: var(--primario); box-shadow: inset 0 3px 0 var(--amarillo), 0 4px 14px rgba(20, 20, 25, .07); }
.categoria-nombre { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; color: var(--muted); }
.categoria.activa .categoria-nombre { color: var(--text); }
.categoria-cuenta { font-family: var(--fuente-titulos); font-size: 38px; line-height: 1; color: var(--text); }
.categoria-pie { display: flex; align-items: center; gap: 10px; min-height: 26px; margin-top: 6px; font-size: 12px; }
.categoria-tareas { color: var(--muted); font-weight: 600; }
.avatares { display: inline-flex; }
.avatares .avatar + .avatar { margin-left: -7px; }
.avatar { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%;
          background: var(--primario); color: var(--amarillo); font-size: 11.5px; font-weight: 700; border: 2px solid var(--card); flex: none; }
.avatar.mas { background: var(--superficie); color: var(--muted); }
.avatar.chico { width: 30px; height: 30px; font-size: 12.5px; border: 0; }
.con-avatar { display: flex; align-items: center; gap: 12px; }

/* tareas: formulario plegado y agentes desplegables */
details.nueva-tarea { margin-bottom: 16px; }
details.nueva-tarea[open] > summary { margin-bottom: 12px; }
.lista-agentes-tareas { background: var(--card); border: 1px solid var(--border); border-radius: var(--radio); box-shadow: var(--sombra); overflow: hidden; }
details.agente-tareas + details.agente-tareas { border-top: 1px solid var(--linea); }
details.agente-tareas > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 12px; padding: 13px 18px; }
details.agente-tareas > summary::-webkit-details-marker { display: none; }
details.agente-tareas > summary:hover { background: var(--hover); }
details.agente-tareas > summary::after { content: "▾"; margin-left: 8px; color: var(--muted); }
details.agente-tareas[open] > summary::after { content: "▴"; }
details.agente-tareas[open] > summary { background: var(--hover); }
.agente-tareas-nombre { font-weight: 700; }
.agente-tareas-datos { margin-left: auto; display: flex; gap: 12px; align-items: center; font-size: 12.5px; color: var(--muted); }
.agente-tareas-cuerpo { padding: 4px 18px 14px 56px; }
.elegir-persona { margin: 6px 0 0; }
.elegir-persona select { width: auto; padding: 4px 8px; font-size: 12.5px; border-style: dashed; }

/* finanzas: gráfico de comportamiento de tarifas */
.grafico-tarifas { --gt-compra: #2a78d6; --gt-venta: #eb6834; --gt-banda: rgba(120, 120, 128, .16); --gt-banda-borde: #b4b4ba; }
.gt-controles { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; margin-bottom: 8px; }
.gt-controles select { width: auto; padding: 6px 10px; font-size: 13px; }
.gt-leyenda { display: flex; gap: 14px; flex-wrap: wrap; margin-left: auto; }
.gt-leyenda label { display: inline-flex; align-items: center; gap: 7px; margin: 0; font-size: 12.5px; font-weight: 600; color: var(--text); cursor: pointer; }
.gt-leyenda input { position: absolute; opacity: 0; pointer-events: none; }
.gt-leyenda input:not(:checked) ~ * , .gt-leyenda label:has(input:not(:checked)) { opacity: .45; }
.gt-leyenda input:focus-visible + span { outline: 3px solid var(--amarillo); outline-offset: 2px; }
.clave-linea { display: inline-block; width: 16px; height: 2px; border-radius: 1px; background: var(--c); }
.clave-linea.compra { --c: var(--gt-compra); }
.clave-linea.venta { --c: var(--gt-venta); }
.clave-banda { display: inline-block; width: 14px; height: 10px; border-radius: 2px; background: var(--gt-banda); border: 1px solid var(--gt-banda-borde); }
.gt-lienzo { position: relative; width: 100%; }
.gt-lienzo svg { display: block; width: 100%; overflow: visible; }
.gt-lienzo svg:focus, .gt-lienzo rect:focus { outline: none; }
.gt-grilla line { stroke: var(--linea); stroke-width: 1; }
.gt-grilla text, .gt-eje-x { fill: var(--muted); font-size: 11px; font-family: var(--fuente); font-variant-numeric: tabular-nums; }
.gt-banda { fill: var(--gt-banda); }
.gt-banda-borde { fill: none; stroke: var(--gt-banda-borde); stroke-width: 1; }
.gt-etiqueta { fill: var(--text); font-size: 11.5px; font-weight: 600; font-family: var(--fuente); }
.gt-guia { stroke: var(--primario); stroke-width: 1; opacity: .35; }
.gt-tip { position: absolute; z-index: 5; min-width: 200px; background: var(--card); border: 1px solid var(--border); border-radius: 6px;
          box-shadow: 0 8px 24px rgba(0, 0, 0, .14); padding: 10px 12px; font-size: 12.5px; pointer-events: none; }
.gt-tip strong { display: block; margin-bottom: 6px; }
.gt-tip-fila { display: flex; align-items: center; gap: 7px; margin: 3px 0; color: var(--muted); }
.gt-tip-fila b { color: var(--text); font-variant-numeric: tabular-nums; }
.gt-tip-ops { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--linea); color: var(--muted); }
.gt-vacio { text-align: center; padding: 40px 0; margin: 0; }

/* sección Tareas: letra más densa para que se lea mejor */
.pagina-tareas { font-weight: 600; }
.pagina-tareas .tarea-cuerpo > div:first-child { font-weight: 700; font-size: 14.5px; }
.pagina-tareas .tarea-meta, .pagina-tareas .muted, .pagina-tareas .meta, .pagina-tareas td { font-weight: 600; color: #3f3f45; }
.pagina-tareas .tarea-meta .vencida { color: var(--red); }
.pagina-tareas .tarea-meta .es-hoy { color: var(--orange); }
.pagina-tareas .agente-tareas-nombre { font-weight: 800; }
.pagina-tareas .agente-tareas-datos { font-weight: 600; color: #3f3f45; }
.pagina-tareas .subtitulo { font-weight: 600; color: #3f3f45; }
.pagina-tareas input, .pagina-tareas select, .pagina-tareas label { font-weight: 600; }
.pagina-tareas th { color: #3f3f45; }

/* =====================================================================
   Letra más densa en toda la app (la Montserrat fina se perdía en pantalla).
   Texto base en 500, secundarios en 500-600 y grises más oscuros.
   ===================================================================== */
:root { --muted: #4a4a51; --suave: #77777e; }
body { font-weight: 500; }
td, li, dd, p, .tile > em, .resumen .dato strong { font-weight: 500; }
.muted, .meta, .subtitulo, .responsable, .tarea-meta, .migas, .fecha .muted, .historial .cuando { font-weight: 500; }
label, th, .ficha dt, .tile > span, .resumen .dato > span, h2 { font-weight: 700; }
td.nombre a, .accion-corta, .tarea-cuerpo > div:first-child { font-weight: 600; }
input, select, textarea, button, .btn { font-weight: 600; }
input::placeholder, textarea::placeholder { font-weight: 500; color: #8a8a91; }
.historial .texto, .ficha dd { font-weight: 600; }
.historial li.sistema .texto { font-weight: 500; }
.ficha dt { font-weight: 500; }
.badge { font-weight: 600; }

/* =====================================================================
   Celulares y pantallas angostas
   ===================================================================== */
.acciones-extra { display: flex; align-items: center; gap: 4px; }
nav.menu { flex: 1; }
.menu-boton { display: none; background: none; border: 0; padding: 8px; cursor: pointer; flex-direction: column; gap: 4px; }
.menu-boton span { display: block; width: 20px; height: 2px; border-radius: 1px; background: #fff; transition: transform .2s, opacity .2s; }
.pestanas, .filtros { overflow-x: auto; scrollbar-width: none; }
.pestanas::-webkit-scrollbar, .filtros::-webkit-scrollbar { display: none; }
.pestanas button, .filtros a { white-space: nowrap; flex: none; }

/* NETWISE: segunda barra, fina, con las herramientas (Onboarding, Newsletter, Cuentas, Respaldo, Comercial) */
.sub-admin { flex: 0 0 calc(100% + 56px); display: flex; align-items: center; gap: 2px; height: 34px; margin: 0 -28px; padding: 0 22px;
             background: #18181b; border-top: 1px solid #2c2c31; }
.sub-admin a, .sub-admin button { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border: 0; border-radius: 6px;
             background: none; font: inherit; font-size: 12px; font-weight: 600; color: #a9a9b0; text-decoration: none; cursor: pointer; }
.sub-admin svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sub-admin a:hover, .sub-admin button:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.sub-admin a.activo { color: var(--amarillo); }
.sub-admin .sub-admin-sep { width: 1px; height: 16px; background: #34343a; margin: 0 6px; }
.sub-admin .menu-candado { margin-left: 2px; }
.solo-movil { display: none !important; }

@media (max-width: 760px) {
  /* encabezado: logo + cotización + ☰ ; el menú se despliega abajo */
  .sub-admin { display: none; }
  .solo-movil { display: inline-flex !important; }
  header { padding: 0 16px; gap: 0 10px; flex-wrap: wrap; }
  .logo { margin-right: auto; }
  .logo .nombre { font-size: 22px; }
  .menu-boton { display: inline-flex; }
  nav.menu, .acciones-extra { display: none; flex-basis: 100%; }
  header.abierto nav.menu { display: flex; flex-direction: column; align-self: auto; padding: 6px 0; border-top: 1px solid #333338; }
  header.abierto .acciones-extra { display: flex; flex-wrap: wrap; padding: 6px 0 12px; border-top: 1px solid #333338; }
  nav.menu a.item { padding: 12px 4px; margin: 0; border-bottom: 0; border-left: 3px solid transparent; font-size: 15px; }
  nav.menu a.item.activo { border-left-color: var(--amarillo); padding-left: 12px; }
  header.abierto .menu-boton span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  header.abierto .menu-boton span:nth-child(2) { opacity: 0; }
  header.abierto .menu-boton span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
  .tc { padding: 5px 10px; font-size: 12px; }
  .tc-panel { position: fixed; left: 12px; right: 12px; top: 64px; width: auto; }

  /* estructura */
  main { padding: 0 14px; margin: 18px auto 36px; }
  h1 { font-size: 27px; }
  .barra { align-items: flex-start; }
  .barra > .btn, .barra > .acciones { width: 100%; }
  .barra > .btn { justify-content: center; }
  .card { padding: 16px; }
  .grid { grid-template-columns: 1fr; gap: 12px; }
  .detalle-layout, .graficos { grid-template-columns: 1fr; }
  .herramientas { border-bottom: 0; }
  .herramientas .controles { width: 100%; flex-wrap: wrap; }
  .herramientas .controles > * { flex: 1 1 100%; width: 100%; }
  .buscar { min-width: 0; }
  .tiles { grid-template-columns: 1fr 1fr; }
  .tile { padding: 12px 14px; }
  .tile > strong { font-size: 18px; }
  .resumen { grid-template-columns: 1fr 1fr; }
  .resumen .dato { padding: 12px 14px; }
  .resumen .dato strong { font-size: 15px; }
  .ficha { grid-template-columns: 1fr; }
  .categorias { grid-template-columns: 1fr 1fr; gap: 10px; }
  .categoria { padding: 14px; }
  .categoria-cuenta { font-size: 32px; }
  .historial li { grid-template-columns: 1fr; gap: 2px; }
  .nota-nueva { flex-direction: column; align-items: stretch; }
  .tarea-nueva input[type=text], .tarea-nueva input[type=date], .tarea-nueva select { flex: 1 1 100%; }
  .tf-opciones > .tf-campo { flex: 1 1 100%; }
  .tf-boton { padding-bottom: 0; }
  .tf-boton .btn { width: 100%; justify-content: center; }
  .doc-subir > * { flex: 1 1 100%; }
  .agente-tareas-cuerpo { padding-left: 18px; }
  details.agente-tareas > summary { flex-wrap: wrap; }
  .agente-tareas-datos { margin-left: 46px; flex-basis: 100%; }
  .gt-leyenda { margin-left: 0; }
  .gt-controles select { flex: 1 1 100%; }
  .link-copiar { flex-wrap: wrap; }
  .zona-peligro { flex-direction: column; align-items: stretch; }
  .clave-finanzas { margin: 24px auto; }
  .multi-panel { min-width: 0; }

  /* tablas: cada fila pasa a ser una tarjeta (rótulo: valor) */
  table.tabla-responsiva thead { display: none; }
  table.tabla-responsiva, table.tabla-responsiva tbody, table.tabla-responsiva tr, table.tabla-responsiva td { display: block; width: 100%; }
  table.tabla-responsiva tr { padding: 12px 14px; border-bottom: 1px solid var(--border); }
  table.tabla-responsiva tr:last-child { border-bottom: 0; }
  table.tabla-responsiva td { border: 0; padding: 3px 0; display: flex; justify-content: space-between; align-items: baseline;
                              gap: 14px; text-align: right; }
  table.tabla-responsiva td::before { content: attr(data-label); flex: none; font-size: 11px; font-weight: 700; text-transform: uppercase;
                                      letter-spacing: .06em; color: var(--muted); text-align: left; }
  table.tabla-responsiva td > * { min-width: 0; }
  table.tabla-responsiva td:first-child { display: block; text-align: left; padding-bottom: 6px; font-size: 15px; }
  table.tabla-responsiva td:first-child::before { display: none; }
  table.tabla-responsiva td[colspan] { display: block; text-align: left; }
  table.tabla-responsiva td[colspan]::before { display: none; }
  table.tabla-responsiva td:empty { display: none; }
  tr.fila-vencida, tr.fila-hoy { position: relative; }
  tr.fila-vencida td:first-child, tr.fila-hoy td:first-child { box-shadow: none; }
  table.tabla-responsiva tr.fila-vencida { box-shadow: inset 3px 0 0 var(--red); }
  table.tabla-responsiva tr.fila-hoy { box-shadow: inset 3px 0 0 var(--amarillo); }
  .tabla-scroll { border-radius: var(--radio); }
  .tabla-costos td:nth-child(3), .tabla-costos td:nth-child(4) { width: auto; }
}

@media (max-width: 420px) {
  .categorias { grid-template-columns: 1fr 1fr; }
  .tc-etq { display: none; }
}

@media (max-width: 760px) {
  /* en las tarjetas, el rótulo a la izquierda y todo el contenido de la celda apilado a la derecha */
  table.tabla-responsiva td { display: grid; grid-template-columns: auto 1fr; column-gap: 14px; align-items: baseline; align-content: start; }
  table.tabla-responsiva td::before { grid-column: 1; grid-row: 1; }
  table.tabla-responsiva td > * { grid-column: 2; justify-self: end; text-align: right; }
  table.tabla-responsiva td:first-child > *, table.tabla-responsiva td[colspan] > * { justify-self: start; text-align: left; }
  table.tabla-responsiva td:first-child, table.tabla-responsiva td[colspan] { display: block; }
}

/* =====================================================================
   Celular, versión compacta: más contenido por pantalla
   ===================================================================== */
@media (max-width: 760px) {
  body { font-size: 13.5px; }
  main { margin: 12px auto 28px; padding: 0 12px; }
  h1 { font-size: 24px; }
  .migas { margin-bottom: 2px; font-size: 12px; }
  .subtitulo { font-size: 12.5px; margin-top: 3px; }
  .barra { margin-bottom: 12px; gap: 8px; }
  .barra > .btn { width: auto; padding: 7px 12px; font-size: 13px; }
  .card { padding: 14px; margin-bottom: 12px; }
  h2 { margin-bottom: 10px; }
  .herramientas { margin-bottom: 10px; gap: 6px; }
  .herramientas .controles { flex-wrap: nowrap; padding: 0; }
  .herramientas .controles > * { flex: 1 1 50%; width: 50%; min-width: 0; font-size: 12.5px; }
  .filtros { gap: 16px; }
  .filtros a, .pestanas button { font-size: 13px; padding: 7px 0; }
  .pestanas { gap: 18px; margin-bottom: 12px; }
  .tiles { margin-bottom: 12px; }
  .tile { padding: 10px 12px; }
  .tile > span { font-size: 10px; }
  .tile > strong { font-size: 16px; margin-top: 3px; }
  .resumen .dato { padding: 10px 12px; }
  .btn { padding: 7px 12px; font-size: 13px; }
  input[type=text], input[type=email], input[type=tel], input[type=search], input[type=date], input[type=number], input[type=password], select, textarea { padding: 7px 10px; font-size: 14px; }
  ul.tareas li { padding: 8px 0; gap: 10px; }
  .grupo-tareas { padding: 12px 14px 4px; }
  .tablero-tareas, .agentes-tareas { gap: 10px; }
  .categoria { padding: 12px; }
  .categoria-cuenta { font-size: 28px; }
  .vacio { padding: 24px 12px; }

  /* tarjetas de tablas responsivas más bajas */
  table.tabla-responsiva tr { padding: 9px 12px; }
  table.tabla-responsiva td { padding: 1px 0; font-size: 12.5px; }
  table.tabla-responsiva td:first-child { font-size: 14px; padding-bottom: 3px; }

  /* Operaciones y Proyectos: 2-3 renglones por fila, sin rótulos.
     Renglón 1: nombre + estado · renglón 2: datos (ruta) · renglones siguientes: tarea y embarque en línea */
  table.tabla-compacta tr { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 10px; row-gap: 1px; padding: 9px 12px; }
  table.tabla-compacta td { display: block; width: auto; padding: 0; font-size: 12.5px; text-align: left; }
  table.tabla-compacta td::before { display: none; }
  table.tabla-compacta td:first-child { flex: 1 1 60%; min-width: 0; font-size: 14px; padding: 0; }
  table.tabla-compacta td:first-child .meta { font-size: 12px; margin-top: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  table.tabla-compacta td:nth-child(2) { flex: 0 1 auto; min-width: 0; max-width: 100%; margin-left: auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  table.tabla-compacta td:nth-child(2) .badge { font-size: 12px; }
  table.tabla-compacta td:nth-child(n+3) { flex: 1 1 100%; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  table.tabla-compacta td:nth-child(n+3) > div, table.tabla-compacta td:nth-child(n+3) > span { display: inline; margin-right: 8px; }
  table.tabla-compacta td:nth-child(n+3) .accion-corta { color: var(--text); font-weight: 600; }
  table.tabla-compacta td:nth-child(n+3) .responsable { font-size: 12px; }
  table.tabla-compacta td:nth-child(n+3) .pill-pronto { margin-top: 0; padding: 0 6px; }
  table.tabla-compacta td .texto-corto { -webkit-line-clamp: 1; max-width: none; }
  table.tabla-compacta td > .muted:only-child { display: none; }  /* celdas vacías ("—") no ocupan renglón */
  table.tabla-compacta td:has(> .muted:only-child) { display: none; }
}

/* tareas: secciones Operaciones / Proyectos */
.seccion-tareas { display: flex; align-items: center; gap: 8px; margin: 22px 0 10px; font-size: 13px; font-weight: 800;
                  text-transform: uppercase; letter-spacing: .08em; color: var(--text); }
.seccion-tareas::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.vacio.chico { padding: 18px; text-align: left; }
.chip-proyecto { background: #fff5c7; }
.tareas-form-proyecto { border-top: 1px solid var(--linea); padding-top: 14px; }

/* ficha de operación: eliminar */
details.eliminar { margin-top: 18px; }
details.eliminar > summary { list-style: none; display: inline; color: var(--red); text-decoration-color: #f1caca; }
details.eliminar > summary::-webkit-details-marker { display: none; }
.eliminar-form { margin-top: 12px; padding: 14px 16px; border: 1px solid #f1caca; border-radius: var(--radio); background: #fffafa; }
.eliminar-form p { margin: 0 0 12px; font-size: 13px; }

@media (max-width: 760px) {
  /* ficha y tareas aún más compactas */
  .tiles .tile > strong { font-size: 14.5px; }
  .tiles .tile > em { font-size: 11.5px; }
  .grupo-tareas ul.tareas { margin-bottom: 4px; }
  .grupo-tareas h2 { margin-bottom: 0; }
  .seccion-tareas { margin: 16px 0 8px; }
  .barra .acciones .btn { padding: 6px 10px; font-size: 12.5px; }
}

/* persona: copiar el contacto de la empresa */
.copiar-contacto { font-size: 13.5px; }
.copiar-contacto .muted { font-size: 12px; }
input[readonly] { background: var(--bg); color: var(--muted); }

/* recuadros desplegables: operaciones por modalidad y secciones de tareas */
details.caja-ops { margin-bottom: 18px; }
details.caja-ops > summary, details.seccion-desplegable > summary { list-style: none; cursor: pointer; user-select: none; }
details.caja-ops > summary::-webkit-details-marker, details.seccion-desplegable > summary::-webkit-details-marker { display: none; }
details.caja-ops > summary { display: flex; align-items: center; gap: 10px; padding: 10px 2px; }
.caja-titulo { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
details.caja-ops > summary::after { content: ""; flex: 1; height: 1px; background: var(--border); order: 3; }
details.caja-ops > summary::before, details.seccion-desplegable > summary::before {
  content: "▾"; font-size: 12px; color: var(--muted); width: 12px; transition: transform .15s; }
details.caja-ops:not([open]) > summary::before, details.seccion-desplegable:not([open]) > summary::before { transform: rotate(-90deg); }
details.caja-ops > summary:hover .caja-titulo, details.seccion-desplegable > summary:hover { color: var(--primario); }
.caja-vacia { margin: 0; padding: 14px 16px; background: var(--card); border: 1px dashed var(--border); border-radius: var(--radio); }
details.seccion-desplegable > summary.seccion-tareas { margin-bottom: 10px; }
details.seccion-desplegable:not([open]) > summary.seccion-tareas { margin-bottom: 0; }
details.seccion-desplegable + details.seccion-desplegable { margin-top: 6px; }

details.caja-ops > summary::before, details.seccion-desplegable > summary::before { font-size: 15px; width: 16px; color: var(--text); }

/* =====================================================================
   Títulos de las cosas en mayúsculas (operaciones, proyectos, agentes, personas, tareas).
   Solo la presentación: los datos quedan guardados como se escribieron.
   ===================================================================== */
td.nombre a, td.nombre > .con-avatar a,
.tarea-cuerpo > div:first-child,
.agente-tareas-nombre,
ul.personas li a strong,
.chip-op,
#panel-todas td:first-child,
.grupo-titulo strong,
.tabla-comparacion td:last-child a,
.lista-docs a { text-transform: uppercase; letter-spacing: .02em; }
.tarea-cuerpo > div:first-child { letter-spacing: .015em; }
.accion-corta { text-transform: uppercase; letter-spacing: .015em; }

/* =====================================================================
   Carátula: tarjetas de las secciones (compactas, con dato destacado)
   ===================================================================== */
.caratula { max-width: 1080px; margin: 8px auto 0; }
.caratula-encabezado { margin-bottom: 22px; }
.caratula-encabezado h1 { font-size: 42px; letter-spacing: .08em; }
.caratula-grilla { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.seccion-tarjeta { position: relative; display: flex; flex-direction: column; gap: 14px; min-height: 188px; padding: 20px 22px;
                   background: var(--card); border: 1px solid var(--border); border-radius: 16px; box-shadow: var(--sombra);
                   color: var(--text); text-decoration: none; overflow: hidden;
                   transition: transform .15s, box-shadow .15s, border-color .15s; }
.seccion-tarjeta::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--amarillo);
                           transform: scaleY(0); transform-origin: top; transition: transform .2s; }
.seccion-tarjeta:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(20, 20, 25, .09); border-color: #d3d0c8; }
.seccion-tarjeta:hover::before, .seccion-tarjeta:focus-visible::before { transform: scaleY(1); }
/* ícono grande de fondo, muy suave */
.seccion-fondo { position: absolute; right: -18px; bottom: -22px; width: 132px; height: 132px; pointer-events: none; }
.seccion-fondo svg { width: 100%; height: 100%; fill: none; stroke: var(--primario); stroke-width: 1.3; opacity: .055;
                     stroke-linecap: round; stroke-linejoin: round; }
.seccion-cabeza { display: flex; align-items: center; gap: 12px; position: relative; }
.seccion-icono { flex: none; width: 42px; height: 42px; border-radius: 12px; background: var(--primario);
                 display: flex; align-items: center; justify-content: center; }
.seccion-icono svg { width: 22px; height: 22px; fill: none; stroke: var(--amarillo); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.seccion-nombre { font-family: var(--fuente-titulos); font-size: 25px; letter-spacing: .04em; line-height: 1; }
.seccion-aviso { min-width: 24px; height: 24px; padding: 0 7px; border-radius: 12px; background: var(--amarillo); color: var(--text);
                 font-weight: 800; font-size: 12px; display: inline-flex; align-items: center; justify-content: center; }
.seccion-flecha { margin-left: auto; font-size: 18px; color: var(--muted); opacity: 0; transform: translateX(-6px); transition: opacity .15s, transform .15s; }
.seccion-tarjeta:hover .seccion-flecha { opacity: 1; transform: none; }
.seccion-cifra { position: relative; font-size: 34px; font-weight: 700; line-height: 1; letter-spacing: -.01em; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.seccion-cifra small { font-size: 13px; font-weight: 600; color: var(--muted); letter-spacing: 0; }
.seccion-chips { position: relative; display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; }
.seccion-chip { font-size: 11.5px; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: var(--superficie); color: #44444a; }
.seccion-chip.rojo { background: var(--red-bg); color: var(--red); }
.seccion-chip.naranja { background: var(--orange-bg); color: var(--orange); }
.seccion-chip.verde { background: var(--green-bg); color: var(--green); }
@media (max-width: 960px) { .caratula-grilla { grid-template-columns: repeat(2, 1fr); gap: 12px; } }
@media (max-width: 760px) {
  .caratula-encabezado { margin-bottom: 14px; }
  .caratula-encabezado h1 { font-size: 32px; }
  .caratula-grilla { gap: 10px; }
  .seccion-tarjeta { min-height: 0; padding: 14px; gap: 10px; border-radius: 14px; }
  .seccion-cabeza { gap: 9px; }
  .seccion-icono { width: 34px; height: 34px; border-radius: 10px; }
  .seccion-icono svg { width: 18px; height: 18px; }
  .seccion-nombre { font-size: 19px; }
  .seccion-cifra { font-size: 26px; gap: 5px; }
  .seccion-cifra small { font-size: 11.5px; }
  .seccion-chip { font-size: 10.5px; padding: 2px 7px; }
  .seccion-fondo { width: 90px; height: 90px; right: -14px; bottom: -16px; }
  .seccion-flecha { display: none; }
}
@media (max-width: 760px) {
  /* celular: de a dos por fila, con lo esencial */
  .caratula-grilla { grid-template-columns: 1fr 1fr; }
  .seccion-tarjeta { padding: 12px; gap: 8px; }
  .seccion-cabeza { gap: 7px; }
  .seccion-icono { width: 30px; height: 30px; border-radius: 9px; }
  .seccion-icono svg { width: 16px; height: 16px; }
  .seccion-nombre { font-size: 17px; }
  .seccion-cifra { font-size: 22px; flex-direction: column; align-items: flex-start; gap: 2px; }
  .seccion-cifra small { font-size: 11px; }
  .seccion-chip:nth-child(n+3) { display: none; }
  .seccion-aviso { min-width: 20px; height: 20px; font-size: 11px; padding: 0 5px; }
}

/* =====================================================================
   CRM (leads) y presupuesto integral
   ===================================================================== */
.l0 { --c: #a8a8ae; } .l1 { --c: #1593c9; } .l2 { --c: #6b6bd6; } .l3 { --c: #12a36b; } .l4 { --c: #8b5cf6; }
.l5 { --c: #c9b98a; } .l6 { --c: #e3a008; } .l7 { --c: #0b6b4f; } .l8 { --c: #5d5d63; }
.prioridad { font-weight: 600; }
.pr-alta { color: var(--red); } .pr-media { color: var(--orange); } .pr-baja { color: var(--muted); }
.seg { font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.seg-hoy, .seg-urgente { color: var(--red); } .seg-seguir { color: var(--orange); } .seg-ok { color: var(--green); }
.seg-pendiente, .seg-cerrado { color: var(--muted); font-weight: 500; }
.importar-leads { position: relative; }
.importar-leads > form { position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; width: 340px; margin: 0; box-shadow: 0 10px 30px rgba(0,0,0,.12); }
.chica { font-size: 12px; margin: 8px 0 0; }
.presupuesto-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start; }
.presu-resumen { position: sticky; top: 16px; }
.presu-resumen .card { border-top: 3px solid var(--amarillo); }
.presu-resumen h3 { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin: 16px 0 6px; }
h2 .paso { display: inline-block; background: var(--amarillo); color: var(--text); font-size: 13px; padding: 1px 7px; border-radius: 4px; margin-right: 6px; }
.presu-tabla th { background: none; padding: 6px 8px; }
.presu-tabla td { padding: 7px 8px; vertical-align: middle; cursor: default; }
.presu-tabla tr:hover td { background: none; }
.presu-tabla td:last-child { width: 150px; text-align: right; }
.presu-tabla input { padding: 6px 8px; }
.presu-tabla tr.subtotal td { border-top: 2px solid var(--text); font-weight: 700; }
.pct-campo { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12.5px; white-space: nowrap; }
.pct-campo input { width: 64px; }
.con-quitar { display: flex; align-items: center; gap: 4px; }
.con-quitar .link-quitar { background: none; border: 0; font-size: 18px; color: var(--suave); cursor: pointer; padding: 0 2px; }
.con-quitar .link-quitar:hover { color: var(--red); }
.presu-totales { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; margin: 0; font-size: 13px; }
.presu-totales dt { color: var(--muted); }
.presu-totales dd { margin: 0; text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.presu-total { background: var(--carbon); color: #fff; border-radius: var(--radio); padding: 12px 14px; margin: 12px 0; }
.presu-total span { display: block; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--amarillo); font-weight: 700; }
.presu-total strong { font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; }
.presu-total strong b { font-weight: 800; }
.presu-total.neto { background: var(--superficie); color: var(--text); }
.presu-total.neto span { color: var(--text); }
.notas-presupuesto { font-size: 13px; }
.barra-guardar { position: sticky; bottom: 0; background: var(--bg); padding: 12px 0; z-index: 5; }
.presu-lista td { vertical-align: middle; }
@media (max-width: 900px) {
  .presupuesto-layout { grid-template-columns: 1fr; }
  .presu-resumen { position: static; order: -1; }
}
@media (max-width: 700px) {
  .presu-tabla th:nth-child(2) { display: none; }
  .presu-tabla td { display: block; padding: 4px 0; border: 0; }
  .presu-tabla tr { display: block; padding: 8px 0; border-bottom: 1px solid var(--linea); }
  .presu-tabla td:last-child { width: auto; }
  .presu-tabla tr:first-child { display: none; }
  .importar-leads > form { position: fixed; left: 16px; right: 16px; top: 120px; width: auto; }
}

/* CRM: orden, paginado y Comercial en la barra superior */
.herramientas.crm-controles { display: flex; align-items: center; justify-content: flex-start; gap: 10px; flex-wrap: wrap; padding: 8px 0; }
.crm-controles label { font-size: 12px; font-weight: 600; color: var(--muted); }
.crm-controles select, .crm-controles input[type=text] { width: auto; padding: 6px 10px; font-size: 13px; }
.crm-cuenta { font-size: 13px; color: var(--muted); padding: 8px 0; }
.paginado { display: flex; align-items: center; justify-content: center; gap: 6px; flex-wrap: wrap; margin: 18px 0 28px; }
.paginado a, .paginado span { min-width: 36px; height: 36px; padding: 0 10px; border-radius: var(--radio); display: inline-flex;
                              align-items: center; justify-content: center; font-weight: 600; font-size: 13px; text-decoration: none;
                              color: var(--text); background: var(--card); border: 1px solid var(--border); }
.paginado a:hover { border-color: var(--primario); }
.paginado .actual { background: var(--primario); color: #fff; border-color: var(--primario); }
.paginado .puntos { background: none; border: 0; color: var(--muted); min-width: 0; }
.paginado .deshabilitado { color: var(--suave); background: none; }
.item-chico.comercial { display: inline-flex; align-items: center; gap: 6px; border: 1px solid #3a3a3f; border-radius: 6px; }
.item-chico.comercial.activo { color: var(--amarillo); border-color: var(--amarillo); }
.estado-rapido { display: inline-flex; align-items: center; gap: 8px; }
.estado-rapido select { width: auto; padding: 5px 8px; font-size: 13px; }

/* Repaso final: recuadros vacíos discretos y formularios plegados */
details.caja-sin > summary { opacity: .55; }
details.caja-sin > summary .caja-titulo { font-weight: 600; }
.agregar-tarea { margin-top: 14px; }
.agregar-tarea[open] > summary { margin-bottom: 12px; }

/* =====================================================================
   Mapa de la red de agentes
   ===================================================================== */
.mapa-red { padding: 16px 18px 12px; }
.mapa-cabeza { display: flex; align-items: center; gap: 10px 16px; flex-wrap: wrap; margin-bottom: 12px; }
.mapa-cabeza h2 { margin: 0; }
.mapa-cabeza #mapa-grande { margin-left: auto; font-size: 16px; line-height: 1; order: 2; }
.mapa-leyenda { order: 3; width: 100%; }
.mapa-lienzo .leaflet-tile-pane { filter: grayscale(1) brightness(1.1) contrast(.82); opacity: .9; }
.mapa-leyenda { display: flex; flex-wrap: wrap; gap: 6px; }
.mapa-filtro { display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer;
               background: var(--superficie); border: 1px solid transparent; border-radius: 999px; padding: 3px 10px 3px 3px; color: var(--text); }
.mapa-filtro .cuenta { color: var(--muted); font-weight: 500; }
.mapa-filtro:not(.activo) { opacity: .4; }
.mapa-filtro:hover { border-color: var(--border); }
.mapa-lienzo { height: 420px; border-radius: var(--radio); overflow: hidden; background: #eef0f2; z-index: 0; }
.mapa-icono { width: 28px; height: 28px; border-radius: 50%; background: #fff; border: 1px solid #dcd9d2;
              box-shadow: 0 1px 4px rgba(20, 20, 25, .14); display: inline-flex; align-items: center; justify-content: center; flex: none;
              transition: transform .15s; }
.mapa-icono svg { width: 15px; height: 15px; fill: none; stroke: #3a3a40; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.mapa-icono.chico { width: 22px; height: 22px; box-shadow: none; }
.mapa-icono.chico svg { width: 13px; height: 13px; }
.categoria-nombre { display: inline-flex; align-items: center; gap: 8px; }
.pin-agente { background: none; border: 0; }
.pin-agente:hover .mapa-icono { transform: scale(1.12); }
.pin-base { background: none; border: 0; }
.pin-base span { width: 30px; height: 30px; border-radius: 50%; background: var(--primario); color: var(--amarillo);
                 display: flex; align-items: center; justify-content: center; font-family: var(--fuente-titulos); font-size: 17px;
                 line-height: 1; padding-top: 2px; box-sizing: border-box; letter-spacing: 0;
                 box-shadow: 0 0 0 4px rgba(254, 216, 53, .35), 0 1px 4px rgba(20, 20, 25, .2); }
.pin-grupo { background: none; border: 0; }
.pin-grupo span { width: 32px; height: 32px; border-radius: 50%; background: #fff; border: 1px solid #dcd9d2;
                  display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 12.5px; color: #2a2a2e;
                  box-shadow: 0 0 0 4px rgba(254, 216, 53, .28), 0 1px 4px rgba(20, 20, 25, .14); }
.popup-agente { font: 13px/1.5 var(--fuente); }
.popup-agente a { font-weight: 600; }
.leaflet-container { font-family: var(--fuente); }
.mapa-red.pantalla-completa { position: fixed; inset: 0; z-index: 1000; margin: 0; border-radius: 0; display: flex; flex-direction: column; }
.mapa-red.pantalla-completa .mapa-lienzo { flex: 1; height: auto; }
@media (max-width: 700px) {
  .mapa-lienzo { height: 300px; }
  .mapa-leyenda { order: 3; width: 100%; }
}

/* Oficinas de un agente */
.sedes { list-style: none; margin: 0 0 12px; padding: 0; }
.sedes li { padding: 10px 0; border-bottom: 1px solid var(--linea); }
.sedes li:last-child { border-bottom: 0; }
.sede-cabeza { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.sedes .suave { color: var(--suave); }
.sedes details form { margin-top: 10px; }
.sede-filas { display: flex; flex-direction: column; gap: 12px; margin-bottom: 4px; }
.sede-fila.grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; margin: 0; align-items: end; }
.sede-filas .sede-fila + .sede-fila { padding-top: 12px; border-top: 1px solid var(--linea); }
.card-interna { margin-top: 14px; }
.card-interna .acciones { margin-top: 14px; }
.sede-filas + .acciones { margin-top: 12px; }

/* Tarifas: edición */
.chip-lote { display: inline-block; margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: var(--superficie);
             color: var(--muted); font-size: 11px; font-weight: 600; vertical-align: middle; }
td.acciones-fila { white-space: nowrap; }
td.acciones-fila > * { display: inline-block; vertical-align: middle; }
td.acciones-fila .link-accion { margin-right: 10px; font-size: 13px; }
.lote-aviso { margin-bottom: 18px; }

/* Tarifas: evolución por puerto */
.grafico-evolucion .gt-leyenda { margin-left: 0; width: 100%; }
.grafico-evolucion .gt-leyenda label { position: relative; }
.grafico-evolucion .gt-lienzo { margin-top: 6px; }

/* Tarifas: desplegables con casillas */
details.filtro-multi { min-width: 200px; }
details.filtro-multi > summary { font-size: 13px; padding: 6px 30px 6px 10px; background: #fff; }
details.filtro-multi.con-filtro > summary { border-color: var(--primario); font-weight: 700; }
details.filtro-multi .multi-panel { min-width: 260px; }
.filtros-tarifas .controles { flex-wrap: wrap; }
#ev-lista label .clave-linea { flex: none; width: 16px; }
.ev-chip { display: inline-flex; align-items: center; gap: 7px; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--text);
           background: var(--superficie); border: 1px solid transparent; border-radius: 999px; padding: 3px 10px; cursor: pointer; }
.ev-chip:hover { border-color: var(--border); }

/* Tareas: formulario de nueva tarea debajo del título */
#nueva-tarea { margin-bottom: 20px; }

/* Evolución: equipos con distinto trazo */
.ev-leyendas { display: flex; flex-direction: column; gap: 6px; margin-bottom: 4px; }
.ev-leyendas .gt-leyenda:empty { display: none; }
.clave-linea.trazo0, .clave-linea.trazo1, .clave-linea.trazo2, .clave-linea.trazo-no { width: 22px; height: 0; border-radius: 0; background: none;
                                                                                     border-top: 2px solid var(--c, var(--text)); }
.clave-linea.trazo1 { border-top-style: dashed; }
.clave-linea.trazo2 { border-top-style: dotted; border-top-width: 3px; }
.clave-linea.trazo-no { border-top-color: transparent; }
#ev-puertos .multi-lista label .clave-linea, #ev-equipos .multi-lista label .clave-linea { flex: none; width: 22px; }

/* Tarifas que salen de las operaciones */
.chip-op-tarifa { background: #fff7dc; color: var(--orange); }
.informante-fijo { display: inline-block; padding: 4px 8px; font-size: 13px; }
tr.fila-operacion td { background: #fffdf6; }

/* =====================================================================
   Celular: repaso de Tarifas, CRM y pestañas
   ===================================================================== */
@media (max-width: 700px) {
  /* pestañas en una sola línea, deslizables */
  .pestanas { flex-wrap: nowrap; overflow-x: auto; gap: 18px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .pestanas::-webkit-scrollbar { display: none; }
  .pestanas button { flex: none; white-space: nowrap; }

  /* controles de los gráficos: grilla de 2 columnas, todos del mismo ancho */
  .gt-controles { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .gt-controles > select, .gt-controles > details.filtro-multi { width: 100%; min-width: 0; }
  .gt-controles > .gt-leyenda { grid-column: 1 / -1; margin-left: 0; }
  details.filtro-multi { min-width: 0; }
  details.filtro-multi > summary { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  details.filtro-multi .multi-panel { min-width: 0; width: calc(100vw - 56px); max-width: 340px; }
  #ev-puertos .multi-panel { right: 0; left: auto; }
  .ev-chip { font-size: 12px; padding: 3px 9px; }

  /* filtros arriba de listas y comparación: a lo ancho */
  .herramientas .controles { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .herramientas .controles > * { width: 100%; min-width: 0; }
  .filtros-tarifas .controles #t-cuenta { grid-column: 1 / -1; }
  .rango-form { flex-wrap: wrap; gap: 6px 8px; width: 100%; }
  .rango-form input { width: 110px; }

  /* listado de tarifas: Editar y ✕ en la misma línea */
  table.tabla-responsiva td.acciones-fila { display: flex; justify-content: flex-end; align-items: center; gap: 18px; padding-top: 6px; }
  table.tabla-responsiva td.acciones-fila::before { display: none; }
  .fuente-editable input { min-width: 0; width: 100%; text-align: right; padding-right: 0; }

  /* CRM: filtros ordenados y lista sin desborde lateral */
  .herramientas.crm-controles { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
  .crm-controles label { display: none; }
  .crm-controles select { grid-column: 1 / -1; width: 100%; }
  .crm-controles .buscar { width: 100%; min-width: 0; }
  .crm-controles .link-accion { grid-column: 1 / -1; }
  .tabla-leads td { min-width: 0; }
  .tabla-leads .nota-corta, .tabla-leads .texto-corto { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
  .tabla-leads .meta { overflow-wrap: anywhere; }
  .paginado a, .paginado span { min-width: 34px; height: 34px; padding: 0 9px; }
}
@media (max-width: 700px) {
  .tabla-leads .meta, .tabla-leads td.nombre, .tabla-leads td { white-space: normal; overflow-wrap: anywhere; }
  .tabla-scroll:has(.tabla-leads) { overflow-x: hidden; }
}

/* =====================================================================
   Exportables
   ===================================================================== */
.pasos { list-style: none; display: flex; gap: 8px; padding: 0; margin: 0 0 18px; counter-reset: paso; flex-wrap: wrap; }
.pasos li { counter-increment: paso; display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--suave);
            padding: 6px 12px 6px 6px; border-radius: 999px; background: var(--card); border: 1px solid var(--border); }
.pasos li::before { content: counter(paso); width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center;
                    justify-content: center; font-size: 12px; background: var(--superficie); color: var(--muted); }
.pasos li.actual { color: var(--text); border-color: var(--primario); }
.pasos li.actual::before { background: var(--amarillo); color: var(--text); }
.pasos li.hecho { color: var(--muted); }
.pasos li.hecho::before { content: "✓"; background: var(--primario); color: var(--amarillo); }
.pasos a { color: inherit; text-decoration: none; }
.lista-clientes { list-style: none; margin: 12px 0 0; padding: 0; max-height: 460px; overflow-y: auto; }
.lista-clientes a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 8px;
                    border-bottom: 1px solid var(--linea); color: var(--text); text-decoration: none; }
.lista-clientes a:hover { background: var(--hover); }
.chips-cliente { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
#buscar-cliente { width: 100%; }
.cliente-elegido { display: flex; justify-content: space-between; align-items: center; gap: 12px; border-left: 4px solid var(--amarillo); }
.titulo-grupo { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin: 0 0 8px; }
.elegir-ref { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.ref-tarjeta { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; align-items: center; padding: 12px 14px; margin-bottom: 8px;
               background: var(--card); border: 1px solid var(--border); border-radius: var(--radio); color: var(--text); text-decoration: none; }
.ref-tarjeta:hover { border-color: #cfccc4; }
.ref-tarjeta.activa { border-color: var(--primario); box-shadow: inset 4px 0 0 var(--amarillo); }
.ref-tarjeta .ref-nombre { font-weight: 700; }
.ref-tarjeta .badge { grid-column: 2; grid-row: 1 / span 2; }
.docs-exportables { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.doc-tarjeta { display: flex; flex-direction: column; gap: 10px; margin: 0; }
.doc-tarjeta.no-aplica { background: var(--superficie); box-shadow: none; }
.doc-cabeza { display: flex; gap: 12px; align-items: center; }
.doc-cabeza h2 { margin: 0; }
.doc-icono { width: 38px; height: 38px; border-radius: 10px; background: var(--primario); color: var(--amarillo); display: flex;
             align-items: center; justify-content: center; font-weight: 800; font-size: 17px; flex: none; }
.doc-fila { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid var(--linea); }
.doc-fila > span:last-child { display: inline-flex; gap: 12px; align-items: center; }
.ajustes-docs { margin: 28px 0; }
.ajustes-docs > summary { margin-bottom: 10px; }
@media (max-width: 700px) {
  .pasos li { font-size: 12px; }
  .elegir-ref, .docs-exportables { grid-template-columns: 1fr; }
  .lista-clientes a { flex-direction: column; align-items: flex-start; }
  .chips-cliente { justify-content: flex-start; }
}

.clave-svg { display: inline-flex; align-items: center; flex: none; width: 24px; height: 8px; }
.clave-svg svg { display: block; }
#ev-puertos .multi-panel, #ev-equipos .multi-panel { min-width: 300px; }
#ev-puertos .multi-lista label { flex-wrap: wrap; row-gap: 0; }
#ev-puertos .multi-lista label .muted.chica { flex-basis: 100%; padding-left: 55px; margin: -2px 0 0; }

/* =====================================================================
   Cuentas, registro y acceso
   ===================================================================== */
.viendo-cuenta { background: var(--amarillo); color: var(--text); padding: 8px 28px; font-size: 13px; display: flex; gap: 12px;
                 align-items: center; flex-wrap: wrap; }
.viendo-cuenta button { font: inherit; font-weight: 700; background: var(--primario); color: #fff; border: 0; border-radius: 6px;
                        padding: 4px 12px; cursor: pointer; }
.acceso { max-width: 400px; margin: 60px auto; }
.acceso-ancho { max-width: 620px; margin-top: 40px; }
.acceso-pie { text-align: center; margin: 16px 0 0; font-size: 13px; }
.tipo-cuenta { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.tipo-opcion { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border: 1px solid var(--border); border-radius: var(--radio);
               cursor: pointer; font-weight: 400; color: var(--text); margin: 0; }
.tipo-opcion:has(input:checked) { border-color: var(--primario); box-shadow: inset 0 0 0 1px var(--primario); background: var(--hover); }
.tipo-opcion input { margin-top: 3px; }
.tipo-opcion > span { display: flex; flex-direction: column; gap: 3px; }
.registro-estado { margin-bottom: 18px; }
.registro-form { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 0; }
.en-linea { display: flex; gap: 6px; align-items: center; margin: 0; }
.en-linea select, .en-linea input { width: auto; padding: 5px 8px; font-size: 13px; }
.tabla-cuentas td { vertical-align: middle; }
.seccion-tarjeta.proximamente { opacity: .7; cursor: default; }
.seccion-tarjeta.proximamente:hover { transform: none; box-shadow: var(--sombra); }
@media (max-width: 700px) {
  .tipo-cuenta { grid-template-columns: 1fr; }
  .viendo-cuenta { padding: 8px 16px; }
}

/* =====================================================================
   Plataforma: pedidos de cotización y newsletter
   ===================================================================== */
.pedidos { list-style: none; margin: 0; padding: 0; }
.pedidos li { padding: 12px 0; border-bottom: 1px solid var(--linea); }
.pedidos li:last-child { border-bottom: 0; }
.pedido-pie { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 6px; }
.pedido-cot { margin-top: 10px; padding: 10px 12px; border-radius: 10px; background: var(--bg); }
.pedido-cot-fila { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.pedido-respuesta { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; margin-top: 8px; }
.pedido-respuesta details { flex: 1 1 200px; }
.pedido-respuesta summary { list-style: none; display: inline-block; cursor: pointer; }
.pedido-respuesta summary::-webkit-details-marker { display: none; }
.pedido-respuesta textarea { width: 100%; min-height: 64px; margin: 8px 0; }
.pedido-pro { margin-top: 10px; padding: 10px 12px; border-radius: 10px; border: 1px dashed var(--amarillo); }
.pedido-pro p { margin: 6px 0 8px; font-size: 13px; }
.combo-puerto { position: relative; }
.combo-puerto input { width: 100%; padding-right: 30px; }
.combo-flecha { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--muted); font-size: 13px; }
.combo-lista { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 30; list-style: none; margin: 0; padding: 4px;
  max-height: 300px; overflow-y: auto; background: var(--card, #fff); border: 1px solid var(--border); border-radius: 10px; box-shadow: var(--sombra); }
.combo-lista li[role=option] { display: flex; justify-content: space-between; gap: 10px; padding: 8px 10px; border-radius: 8px; cursor: pointer; }
.combo-lista li[role=option] .muted { font-size: 12px; }
.combo-lista li.marcada, .combo-lista li[role=option]:hover { background: var(--superficie); }
.combo-lista li.elegida { box-shadow: inset 3px 0 0 var(--amarillo); }
.combo-pais { padding: 8px 10px 4px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.combo-sin { padding: 10px; font-size: 13px; color: var(--muted); }
.datos-pedido { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 16px; margin: 0 0 12px; }
.datos-pedido dt { color: var(--muted); font-size: 12.5px; }
.datos-pedido dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.presu-tributos td { padding-top: 4px; font-size: 13px; }
.presu-tributos td:first-child { padding-left: 18px; }
.contenedores { border: 1px solid var(--border); border-radius: 10px; padding: 10px 14px 14px; margin: 0 0 14px; }
.contenedores legend { padding: 0 6px; font-size: 13px; font-weight: 600; }
.fila-cont { display: grid; grid-template-columns: 76px auto minmax(0, 1fr) auto; gap: 8px; align-items: center; margin-bottom: 8px; }
.fila-cont .quitar-fila[hidden] { display: none; }
.pedido-estado { font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 999px; background: var(--orange-bg); color: var(--orange); }
.novedades { max-width: 820px; display: flex; flex-direction: column; gap: 16px; margin-bottom: 24px; }
.novedad { margin: 0; }
.novedad.borrador { border-style: dashed; }
.novedad-meta { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 8px; }
.novedad-titulo { font-family: var(--fuente); text-transform: none; letter-spacing: 0; font-size: 20px; font-weight: 800; color: var(--text); margin: 0 0 8px; }
.novedad-cuerpo { font-size: 14.5px; line-height: 1.65; }
.novedad-cuerpo p { margin: 0 0 10px; }
.novedad-cuerpo ul { margin: 0 0 10px; padding-left: 20px; }
.ultima-novedad { position: relative; flex: 1; display: flex; align-items: flex-start; text-align: left;
                  font-weight: 700; font-size: 15px; line-height: 1.35; min-width: 0; }
.ultima-novedad > span { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
/* Pantallas medianas: menú y accesos de la derecha más compactos para que entren en una línea */
@media (min-width: 761px) and (max-width: 1440px) {
  header { padding: 0 18px; gap: 10px; }
  .sub-admin { flex-basis: calc(100% + 36px); margin: 0 -18px; padding: 0 12px; }
  nav.menu a.item { padding: 0 9px; font-size: 13px; }
  .item-chico { padding: 6px 5px; font-size: 12px; }
  .tc { padding-left: 10px; padding-right: 10px; }
}

/* CRM: filtros en grilla (título arriba de cada campo, todo alineado) */
.crm-filtros { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.5fr); gap: 12px 14px; align-items: end;
               padding: 2px 0 16px; margin-bottom: 18px; border-bottom: 1px solid var(--border); }
.cf-grupo { display: flex; flex-direction: column; min-width: 0; }
.cf-grupo label { font-size: 12px; font-weight: 700; color: var(--muted); margin: 0 0 5px; }
.cf-grupo select, .cf-grupo input { width: 100%; min-width: 0; height: 38px; padding: 0 10px; font-size: 13px; }
.cf-linea { display: flex; gap: 8px; }
.cf-linea input { flex: 1; }
.cf-linea .btn { height: 38px; padding: 0 16px; white-space: nowrap; }
.cf-limpiar { grid-column: 1 / -1; justify-self: start; font-size: 13px; }
/* Ingreso y registro: texto del botón centrado */
.acceso .btn { justify-content: center; text-align: center; }
@media (max-width: 900px) { .crm-filtros { grid-template-columns: 1fr 1fr; } .cf-buscar { grid-column: 1 / -1; } }
@media (max-width: 700px) {
  .crm-filtros { grid-template-columns: 1fr; gap: 8px; }
  .cf-grupo label { display: none; }
}

/* Newsletter: avisos del Boletín Oficial */
.novedad-organismo { font-size: 11.5px; font-weight: 700; letter-spacing: .04em; color: var(--muted); text-transform: uppercase; margin-bottom: 4px; }
.novedad-titulo.chico { font-size: 16.5px; }
.boletin-ajustes { margin-bottom: 20px; }
.rubros-bo { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 6px; }
.traer-bo { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--linea); }

/* =====================================================================
   Newsletter: portada estilo diario y página de lectura
   ===================================================================== */
.nl { max-width: 1120px; margin: 0 auto; }
.nl-cabecera { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap;
               padding-bottom: 14px; border-bottom: 4px solid var(--text); }
.nl-marca { font-size: 11px; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
.nl-titulo { font-family: var(--fuente-titulos); font-size: 54px; letter-spacing: .03em; line-height: .95; margin: 6px 0 6px; }
.nl-bajada { font-size: 13px; color: var(--muted); }
.nl-bajada::first-letter { text-transform: uppercase; }
.nl-secciones { display: flex; gap: 6px 22px; flex-wrap: wrap; padding: 10px 0; border-bottom: 1px solid var(--border); margin-bottom: 22px; }
.nl-secciones a { font-size: 13px; font-weight: 700; text-decoration: none; color: #55555c; padding: 4px 0; border-bottom: 2px solid transparent; }
.nl-secciones a:hover { color: var(--text); }
.nl-secciones a.activa { color: var(--text); border-bottom-color: var(--amarillo); }
.nl-portada { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.nl-portada.sin-notas { grid-template-columns: 1fr; }
.nl-etiqueta { display: inline-block; font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase;
               color: var(--text); background: var(--amarillo); padding: 2px 8px; border-radius: 3px; }
.nl-destacada, .nl-tarjeta { display: flex; flex-direction: column; gap: 10px; text-decoration: none; color: var(--text);
                             background: var(--card); border: 1px solid var(--border); border-radius: 12px; transition: border-color .15s, box-shadow .15s; }
.nl-destacada { padding: 28px 30px; border-top: 5px solid var(--amarillo); margin-bottom: 18px; }
.nl-destacada:hover, .nl-tarjeta:hover { border-color: #cfccc4; box-shadow: 0 8px 22px rgba(20, 20, 25, .07); }
.nl-destacada .nl-etiqueta, .nl-tarjeta .nl-etiqueta { align-self: flex-start; }
.nl-destacada-titulo { font-size: 30px; font-weight: 800; line-height: 1.15; letter-spacing: -.01em; }
.nl-extracto { font-size: 15px; line-height: 1.6; color: #3c3c42; }
.nl-pie { font-size: 12.5px; color: var(--muted); margin-top: auto; }
.nl-pie strong { color: var(--text); }
.nl-grilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.nl-grilla.ancha { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.nl-tarjeta { padding: 18px 20px; }
.nl-tarjeta-titulo { font-size: 17px; font-weight: 800; line-height: 1.25; }
.nl-tarjeta .nl-extracto { font-size: 13.5px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.nl-destacada.borrador, .nl-tarjeta.borrador, .bo-item.borrador { border-style: dashed; opacity: .8; }
/* columna del Boletín Oficial */
.nl-boletin { background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 18px 18px 6px; }
.nl-boletin.ancho { background: none; border: 0; padding: 0; }
.nl-boletin-cabeza { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding-bottom: 10px;
                     border-bottom: 2px solid var(--text); margin-bottom: 4px; }
.nl-boletin-cabeza h2 { margin: 0; font-family: var(--fuente-titulos); font-size: 22px; letter-spacing: .05em; text-transform: none; color: var(--text); }
.bo-dia { margin-bottom: 14px; }
.bo-fecha { font-size: 11.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); padding: 10px 0 4px; }
.bo-fecha::first-letter { text-transform: uppercase; }
.bo-grilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.bo-item { display: flex; flex-direction: column; gap: 3px; padding: 11px 0; border-bottom: 1px solid var(--linea); text-decoration: none; color: var(--text); }
.bo-item:hover .bo-norma { text-decoration: underline; text-decoration-color: var(--amarillo); text-underline-offset: 3px; }
.nl-boletin.ancho .bo-item { background: var(--card); border: 1px solid var(--border); border-radius: 10px; padding: 14px 16px; }
.bo-tipo { align-self: flex-start; font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted);
           border: 1px solid var(--border); border-radius: 3px; padding: 1px 6px; }
.bo-norma { font-weight: 800; font-size: 14px; line-height: 1.3; }
.bo-organismo { font-size: 12px; color: var(--muted); font-weight: 600; }
.bo-resumen { font-size: 13px; line-height: 1.5; color: #44444a; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lista-borradores { list-style: none; margin: 0; padding: 0; }
.lista-borradores li { padding: 8px 0; border-bottom: 1px solid var(--linea); display: flex; flex-direction: column; }
@media (max-width: 900px) {
  .nl-portada { grid-template-columns: 1fr; }
  .nl-grilla.ancha, .bo-grilla { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 700px) {
  .nl-titulo { font-size: 38px; }
  .nl-destacada { padding: 20px; }
  .nl-destacada-titulo { font-size: 23px; }
  .nl-grilla, .nl-grilla.ancha, .bo-grilla { grid-template-columns: 1fr; }
}

/* ---- Newsletter: página de lectura, estilo diario */
.nl-articulo { --serif: "Newsreader", Georgia, "Times New Roman", serif; max-width: 700px; margin: 0 auto 48px; }
.art-cabecera { padding: 18px 0 20px; border-bottom: 1px solid var(--text); margin-bottom: 26px; }
.art-antetitulo { font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #8a6d00; }
.art-punto { color: var(--muted); margin: 0 2px; }
.art-titulo { font-family: var(--serif); text-transform: none; font-size: 40px; font-weight: 600; line-height: 1.12;
              letter-spacing: -.01em; margin: 10px 0 0; color: var(--text); }
.art-copete { font-family: var(--serif); font-size: 20px; font-weight: 400; font-style: italic; line-height: 1.45; color: #55555c; margin: 12px 0 0; }
.art-firma { display: flex; flex-wrap: wrap; gap: 4px 0; align-items: center; margin-top: 18px; font-size: 12.5px; color: var(--muted); }
.art-firma > span + span::before { content: "·"; margin: 0 9px; color: #b9b6ae; }
.art-firma > span:first-child::first-letter { text-transform: uppercase; }
.art-resumen { margin: 0 0 30px; padding: 2px 0 2px 20px; border-left: 2px solid var(--amarillo); }
.art-resumen-titulo { font-size: 10.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.art-resumen p { font-family: var(--serif); font-size: 19px; line-height: 1.55; font-weight: 400; color: #33333a; margin: 6px 0 0; }
.art-cuerpo { font-family: var(--serif); font-size: 19px; line-height: 1.72; font-weight: 400; color: #222226; }
.art-cuerpo p { margin: 0 0 1.1em; }
.art-cuerpo ul { margin: 0 0 1.1em; padding-left: 22px; }
.art-nota > p:first-of-type::first-letter { float: left; font-size: 3.4em; line-height: .86; font-weight: 600; margin: .06em .08em 0 0; color: var(--text); }
.art-legal { font-size: 18px; }
.art-legal p.fila-tabla { font-family: var(--fuente); font-size: 13px; line-height: 1.5; background: var(--superficie); padding: 6px 10px;
                          border-radius: 4px; margin: 0 0 4px; overflow-wrap: anywhere; }
.art-legal p.fila-tabla::first-letter { float: none; font-size: inherit; margin: 0; }
.art-pendiente { font-style: italic; color: var(--muted); }
.art-pendiente::first-letter { float: none !important; font-size: inherit !important; margin: 0 !important; }
.art-acciones { display: flex; gap: 8px 22px; flex-wrap: wrap; align-items: center; padding: 18px 0; margin-top: 14px;
                border-top: 1px solid var(--border); font-size: 14px; }
.art-enlace { color: var(--text); font-weight: 600; text-decoration: underline; text-decoration-color: var(--amarillo);
              text-decoration-thickness: 2px; text-underline-offset: 4px; }
.art-admin { margin-left: auto; display: flex; gap: 14px; align-items: center; }
.art-admin form { margin: 0; }
.art-admin button { background: none; border: 0; padding: 0; cursor: pointer; font: inherit; }
.link-accion.peligro { color: #b42318; }
.art-navegacion { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; border-top: 1px solid var(--border); padding-top: 14px; }
.art-navegacion a { display: flex; flex-direction: column; gap: 2px; min-width: 0; text-decoration: none; color: var(--text); }
.art-navegacion a.derecha { text-align: right; }
.art-navegacion a span { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); font-weight: 700; }
.art-navegacion a em { font-family: var(--serif); font-style: normal; font-size: 15px; line-height: 1.35; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.art-navegacion a:hover em { text-decoration: underline; text-decoration-color: var(--amarillo); text-underline-offset: 3px; }
@media (max-width: 700px) {
  .art-titulo { font-size: 29px; }
  .art-copete { font-size: 17.5px; }
  .art-cuerpo, .art-legal { font-size: 17px; }
  .art-resumen p { font-size: 17px; }
  .art-firma { gap: 2px 14px; }
  .art-firma > span + span::before { content: none; }
  .art-admin { margin-left: 0; }
  .art-navegacion { grid-template-columns: 1fr; gap: 12px; }
  .art-navegacion a.derecha { text-align: left; }
}

/* ---- Exportables: marca de los documentos (paleta, tipografía y vista previa) */
.estilo-docs { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 22px; align-items: start; margin-bottom: 8px; }
.etiqueta-campo { display: block; font-size: 12px; font-weight: 700; color: var(--muted); margin-bottom: 8px; }
.paletas { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.paleta, .fuente-doc { display: flex; align-items: center; gap: 9px; border: 1.5px solid var(--border); border-radius: 9px; padding: 8px 10px;
                       cursor: pointer; font-size: 13px; font-weight: 600; background: var(--card); margin: 0; }
.paleta:hover, .fuente-doc:hover { border-color: #bdb9b0; }
.paleta.elegida, .fuente-doc.elegida { border-color: var(--text); box-shadow: 0 0 0 1px var(--text) inset; }
.paleta input, .fuente-doc input { position: absolute; opacity: 0; pointer-events: none; }
.paleta .muestra { display: inline-flex; border-radius: 5px; overflow: hidden; border: 1px solid rgba(0,0,0,.12); flex: none; }
.paleta .muestra i { width: 16px; height: 22px; display: block; }
.paleta .muestra.propia { width: 32px; height: 22px; background: conic-gradient(#e63946, #f2a541, #5fc4b8, #4f8ef7, #9b5de5, #e63946); }
.colores-propios { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-top: 10px; }
.colores-propios label { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; margin: 0; }
.colores-propios input[type=color] { width: 44px; height: 32px; padding: 2px; border: 1px solid var(--border); border-radius: 6px; background: var(--card); cursor: pointer; }
.fuentes-docs { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px; }
.fuente-doc { flex-direction: column; align-items: flex-start; gap: 2px; }
.fuente-doc strong { font-size: 17px; line-height: 1.2; }
.vista-doc { --vd-prim: #24272e; --vd-acen: #4f8ef7; --vd-sobre-prim: #fff; --vd-sobre-acen: #1b1b1e; --vd-titulo: Arial; --vd-texto: Arial;
             --vd-mayus: none; --vd-peso: 700; --vd-espaciado: 0; --vd-escala: 1;
             position: sticky; top: 12px; background: #fff; border: 1px solid var(--border); border-radius: 8px; overflow: hidden;
             box-shadow: 0 8px 24px rgba(20, 20, 25, .08); font-family: var(--vd-texto); color: #1b1b1e; }
.vd-cabecera { background: var(--vd-prim); color: var(--vd-sobre-prim); border-bottom: 3px solid var(--vd-acen); padding: 16px 18px 12px;
               display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; }
.vd-nombre { font-family: var(--vd-titulo); font-weight: var(--vd-peso); text-transform: var(--vd-mayus); letter-spacing: var(--vd-espaciado);
             font-size: calc(28px * var(--vd-escala)); line-height: 1; overflow-wrap: anywhere; }
.vd-bajada { font-size: 7px; letter-spacing: .3em; color: var(--vd-acen); font-weight: 600; margin-top: 4px; }
.vd-doc { font-family: var(--vd-titulo); font-weight: var(--vd-peso); text-transform: var(--vd-mayus); letter-spacing: var(--vd-espaciado);
          font-size: calc(17px * var(--vd-escala)); }
.vd-cuerpo { padding: 14px 18px 10px; font-size: 11px; }
.vd-h2 { font-family: var(--vd-titulo); font-weight: var(--vd-peso); text-transform: var(--vd-mayus); letter-spacing: var(--vd-espaciado);
         font-size: calc(14px * max(var(--vd-escala), .82)); display: flex; align-items: center; gap: 7px; margin-bottom: 6px; }
.vd-h2 span { background: var(--vd-acen); color: var(--vd-sobre-acen); font-size: 10px; padding: 1px 6px; border-radius: 3px; }
.vd-fila { display: flex; justify-content: space-between; padding: 5px 0; border-bottom: 1px solid #f0eee9; }
.vd-total { display: flex; justify-content: space-between; align-items: baseline; margin-top: 10px; background: var(--vd-prim); color: var(--vd-sobre-prim);
            border-radius: 5px; padding: 9px 12px; }
.vd-total span { font-size: 8px; letter-spacing: .16em; text-transform: uppercase; color: var(--vd-acen); font-weight: 700; }
.vd-total b { font-size: 15px; }
.vd-pie { background: #f6f5f1; border-top: 2px solid var(--vd-acen); padding: 7px 18px; font-size: 9px; color: #6b6b72; }
@media (max-width: 860px) {
  .estilo-docs { grid-template-columns: 1fr; }
  .vista-doc { position: static; order: -1; }
}
.copiar-cliente { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; max-width: 320px; }
.copiar-cliente select { flex: 1; min-width: 140px; }
.copiar-cliente .muted { flex-basis: 100%; }

/* ---- N° de BL: en la operación y en el tablero */
.bl-linea { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: var(--card); border: 1px solid var(--border);
            border-radius: 10px; padding: 10px 14px; margin-bottom: 14px; }
.bl-linea label { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.bl-linea input { flex: 1; min-width: 160px; max-width: 320px; font-weight: 700; }
.bl-linea.vacio { border-style: dashed; border-color: #d9b100; background: #fffbea; }
.bl-linea .bl-dias input { min-width: 70px; max-width: 90px; }
.bl-devolucion { font-size: 12.5px; color: var(--muted); }
.bl-linea.solo-lectura { gap: 22px; }
.bl-linea.solo-lectura .bl-campo { display: inline-flex; align-items: baseline; gap: 8px; }
.bl-linea.solo-lectura .etq { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.bl-quien { margin-left: auto; font-size: 12.5px; color: var(--muted); }
.bl-devolucion strong { color: var(--text); }
.resumen .dato em { display: block; font-style: normal; font-size: 12px; color: var(--muted); margin-top: 3px; }
.bl-numero { font-size: 12px; margin-top: 3px; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.bl-numero span { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; color: var(--muted); }
.bl-cargar { display: flex; gap: 4px; margin-top: 4px; max-width: 220px; }
.bl-cargar input { padding: 3px 8px; font-size: 12px; height: 26px; min-width: 0; flex: 1; border-style: dashed; }
.bl-cargar button { height: 26px; width: 28px; border: 1px solid var(--border); border-radius: 6px; background: var(--card); cursor: pointer; font-size: 12px; }
.bl-cargar button:hover { background: var(--amarillo); border-color: var(--amarillo); }

/* ---- Operación: cambiar el nombre desde el título; BL y shipper */
.titulo-op { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; }
.renombrar { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 8px;
             border: 1px solid transparent; background: none; cursor: pointer; color: var(--muted); padding: 0; }
.renombrar svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.renombrar:hover { border-color: var(--border); background: var(--card); color: var(--text); }
.renombrar-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 4px 0 6px; }
.renombrar-form input { font-size: 20px; font-weight: 700; min-width: 260px; flex: 1; max-width: 520px; }
.bl-campo { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 220px; max-width: 420px; }
.bl-campo input { max-width: none; }
.bl-campo.bl-dias { flex: 0 0 auto; min-width: 0; }
@media (max-width: 700px) {
  .bl-campo { flex-basis: 100%; max-width: none; }
  .bl-campo label { min-width: 74px; }
  .renombrar-form input { min-width: 0; font-size: 17px; }
}

/* ---- Exportables de una empresa importadora: documentos por operación */
.exp-op { margin-bottom: 14px; }
.exp-op-cabeza { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 6px; }
.exp-op-cabeza h2 { margin: 0 0 2px; font-size: 17px; text-transform: none; letter-spacing: 0; color: var(--text); }
.exp-docs { list-style: none; margin: 0; padding: 0; }
.exp-docs li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid var(--linea); }
.exp-docs li > span:first-child { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.exp-botones { display: inline-flex; align-items: center; gap: 12px; flex: none; }
.ajustes-docs { margin-top: 18px; }

/* ---- Mapa de operaciones (agentes y empresas) */
.mapa-ops { margin-bottom: 22px; }
.mapa-ops .mapa-cabeza #mapa-ops-grande { margin-left: auto; font-size: 16px; line-height: 1; order: 2; }
.mapa-ops .mapa-lienzo { height: 380px; }
.mapa-ops .mapa-icono { border-color: color-mix(in srgb, var(--tipo, #3a3a40) 35%, #fff); }
.mapa-ops .mapa-icono svg { stroke: var(--tipo, #3a3a40); }
.mapa-ops .mapa-filtro.sin-ops { opacity: .45; }
.mapa-ops .mapa-filtro:not(.activo) { opacity: .35; }
.mapa-ops.pantalla-completa .mapa-lienzo { height: auto; }
@media (max-width: 700px) { .mapa-ops .mapa-lienzo { height: 280px; } }
.mapa-avisos { margin-top: 8px; padding: 8px 12px; border-radius: 8px; background: #fffbea; border: 1px dashed #d9b100; }
.mapa-avisos p { margin: 2px 0; }
.mapa-ops { margin: 26px 0 0; }
.mapa-estados { display: inline-flex; gap: 6px; }
.mapa-separador { width: 1px; align-self: stretch; background: var(--border); margin: 2px 4px; }
.punto-estado { width: 10px; height: 10px; border-radius: 50%; background: #2563a8; margin-left: 6px; }
.punto-estado.cerrada { background: transparent; border: 1.5px dashed #8a8780; }
@media (max-width: 700px) { .mapa-separador { display: none; } }
.mapa-ops .mapa-icono { position: relative; }
.pin-cuenta { position: absolute; top: -7px; right: -9px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px;
              background: var(--primario); color: #fff; font: 700 10px/17px var(--fuente); text-align: center; box-shadow: 0 0 0 2px #fff; }
.popup-ops { list-style: none; margin: 6px 0 0; padding: 0; }
.popup-ops li { padding: 5px 0; border-top: 1px solid #eee; }

/* ---- Exportables del importador: buscador desplegable de operaciones */
.exp-elegir { margin-bottom: 14px; }
.exp-filtros { display: grid; grid-template-columns: minmax(0, 1fr) 190px 210px; gap: 10px; align-items: start; }
.exp-combo { position: relative; }
.exp-combo input { width: 100%; padding-right: 34px; }
.exp-combo input::placeholder { color: var(--text); font-weight: 600; opacity: .85; }
.exp-combo-flecha { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); cursor: pointer; color: var(--muted); font-size: 13px; }
.exp-lista { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 30; list-style: none; margin: 0; padding: 4px;
             max-height: 340px; overflow-y: auto; background: var(--card); border: 1px solid var(--border); border-radius: 10px;
             box-shadow: 0 12px 30px rgba(20, 20, 25, .12); }
.exp-lista li a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1px 10px; align-items: center; padding: 8px 10px;
                  border-radius: 7px; text-decoration: none; color: var(--text); }
.exp-lista li a .muted { grid-column: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.exp-lista li a .badge { grid-column: 2; grid-row: 1 / span 2; }
.exp-lista li a:hover, .exp-lista li.marcada a { background: var(--superficie); }
.exp-lista li.elegida a { box-shadow: inset 3px 0 0 var(--amarillo); }
.exp-sin { padding: 10px; color: var(--muted); font-size: 13px; }
.exp-op .titulo-grupo { margin: 14px 0 2px; }
@media (max-width: 760px) { .exp-filtros { grid-template-columns: 1fr 1fr; } .exp-combo { grid-column: 1 / -1; } }

/* ---- Exportables: tarjeta del Resumen de gestión */
.gestion-tarjeta { display: flex; align-items: center; gap: 16px; margin-bottom: 14px; border-left: 4px solid var(--amarillo); }
.gestion-tarjeta h2 { margin: 0 0 3px; }
.gestion-tarjeta > div { flex: 1; }
.cliente-elegido .acciones { display: inline-flex; gap: 8px; align-items: center; flex-wrap: wrap; }
@media (max-width: 700px) { .gestion-tarjeta { flex-wrap: wrap; } .gestion-tarjeta .btn { width: 100%; justify-content: center; } }

/* ---- Onboarding: índice + una sección por pestaña; lo que suma la membresía, marcado PRO */
.onb-hero { background: var(--carbon); color: #fff; border-radius: var(--radio); padding: 30px 32px 26px; margin-bottom: 20px;
            border-bottom: 3px solid var(--amarillo); }
.onb-eyebrow { display: block; font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--amarillo); }
.onb-hero h1 { font-family: var(--fuente-titulos); font-weight: 400; font-size: 46px; letter-spacing: .04em; line-height: 1; margin: 8px 0 8px; }
.onb-hero p { margin: 0; color: #c9c9ce; max-width: 560px; }
.onb-hero-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 18px; font-size: 12.5px; }
.onb-plan { padding: 3px 10px; border-radius: 999px; background: var(--amarillo); color: var(--text); font-weight: 700; }
.onb-plan.gratis { background: #3a3a3d; color: #fff; }
.onb-hero-dato { color: #c9c9ce; }
.onb-hero-dato a { color: var(--amarillo); font-weight: 600; }
.onb-candado { flex: 1; min-width: 220px; font-size: 13px; }
.onb-candado::before { content: "🔒 "; }
.onb-membresia { background: var(--carbon); color: #fff; border-radius: var(--radio); padding: 28px 32px; margin-bottom: 20px;
                 border-left: 4px solid var(--amarillo); scroll-margin-top: 16px; }
.onb-membresia h2 { color: #fff; font-family: var(--fuente-titulos); font-weight: 400; font-size: 32px; letter-spacing: .04em; margin: 6px 0 8px; }
.onb-membresia p { color: #c9c9ce; margin: 0 0 10px; }
.onb-membresia ul { margin: 0 0 20px; padding-left: 18px; display: grid; gap: 6px; color: #e6e6ea; }
.onb-membresia strong { color: #fff; }
.onb-membresia form { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 0; color: #c9c9ce; }
.onb-final { text-align: center; margin: 4px 0 20px; }
.onb-planes table { width: 100%; border-collapse: collapse; font-size: 13px; }
.onb-planes th, .onb-planes td { padding: 9px 12px; border-bottom: 1px solid var(--linea); text-align: center; vertical-align: middle; }
.onb-planes tbody th { text-align: left; font-weight: 600; }
.onb-planes thead th { font-size: 14px; font-weight: 700; border-bottom: 2px solid var(--border); }
.onb-planes thead th span { display: block; font-size: 11px; font-weight: 500; color: var(--muted); }
.onb-planes .tuyo { background: #fff8d6; }
.onb-planes thead th.tuyo { box-shadow: inset 0 3px 0 var(--amarillo); }
.onb-si { color: var(--green); font-weight: 800; font-size: 15px; }
.onb-no { color: var(--suave); }
.onb-btn-agente { background: transparent; border-color: #5a5a5f; color: #fff; }
.onb-btn-agente:hover { background: #3a3a3d; }
.aviso-agente { margin-top: 10px; padding: 10px 12px; border-radius: 6px; background: #fffbea; border: 1px solid #f0d860; font-size: 13px; }
.onb-tabla { overflow-x: auto; }
.onb-num { font-family: var(--fuente-titulos); font-size: 24px; color: var(--amarillo-h); line-height: 1; width: 30px; flex: none;
           font-variant-numeric: tabular-nums; }
.onb-pro { display: inline-block; font-family: var(--fuente); font-size: 10px; font-weight: 800; letter-spacing: .08em; padding: 2px 7px;
           border-radius: 4px; background: var(--amarillo); color: var(--text); vertical-align: middle; }
.onb-barra { display: flex; align-items: center; justify-content: space-between; margin: 0 0 10px; }
/* cada pestaña: una fila plegada (número, ícono, nombre y para qué sirve); al tocarla se abren los pasos */
.onb-seccion { background: var(--card); border: 1px solid var(--border); border-radius: var(--radio); margin-bottom: 8px; scroll-margin-top: 16px; }
.onb-seccion.bloqueada { border-style: dashed; }
.onb-cabeza { display: flex; align-items: center; gap: 14px; padding: 12px 18px; cursor: pointer; list-style: none; }
.onb-cabeza::-webkit-details-marker { display: none; }
.onb-cabeza:hover { background: var(--hover); border-radius: var(--radio); }
.onb-icono { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; flex: none; border-radius: 9px;
             background: var(--superficie); font-size: 16px; }
.onb-titulo { flex: 1; min-width: 0; }
.onb-titulo strong { display: block; font-size: 15px; }
.onb-resumen { display: block; color: var(--muted); font-size: 13px; }
.onb-flecha { color: var(--muted); transition: transform .15s; }
.onb-seccion[open] .onb-flecha { transform: rotate(180deg); }
.onb-seccion[open] .onb-cabeza { border-bottom: 1px solid var(--linea); border-radius: var(--radio) var(--radio) 0 0; }
.onb-cuerpo { padding: 4px 18px 14px 96px; }
.onb-pasos { margin: 10px 0 0; padding-left: 18px; display: grid; gap: 6px; }
.onb-pasos li::marker { color: var(--muted); font-weight: 700; }
.onb-seccion.bloqueada .onb-pasos, .onb-seccion.bloqueada .onb-icono, .onb-seccion.bloqueada .onb-titulo strong { opacity: .6; }
.onb-pie { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap;
           margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--linea); }
.onb-suma { margin: 12px 0 0; padding: 9px 12px; border-radius: 6px; background: #fffbea; border: 1px dashed #e9c800; font-size: 13px; }
.onb-final { text-align: center; margin: 14px 0 20px; }
/* carátula: cuadro de planes plegable */
.onb-planes { margin-top: 20px; }
.onb-planes > summary { display: flex; align-items: baseline; justify-content: space-between; gap: 8px 16px; flex-wrap: wrap; cursor: pointer; list-style: none; }
.onb-planes > summary::-webkit-details-marker { display: none; }
.onb-planes > summary h2 { margin: 0; }
.onb-planes > summary h2::after { content: " ▾"; color: var(--muted); font-size: 14px; }
.onb-planes[open] > summary h2::after { content: " ▴"; }
.onb-planes[open] > summary { margin-bottom: 14px; }
.caratula .onb-membresia { margin-top: 24px; }
@media (max-width: 700px) {
  .onb-hero, .onb-membresia { padding: 22px 18px; }
  .onb-hero h1 { font-size: 36px; }
  .onb-cabeza { padding: 12px 14px; gap: 10px; }
  .onb-num { display: none; }
  .onb-cuerpo { padding: 4px 14px 14px 14px; }
  .onb-planes th, .onb-planes td { padding: 8px 6px; }
}
.aviso-marca { margin: 0 0 14px; }

/* ---- Tarifas: mercado NETWISE / mis tarifas; reportes al mercado */
.tarifas-switch { display: inline-flex; padding: 3px; margin: -6px 0 18px; border-radius: 999px; background: var(--superficie); border: 1px solid var(--border); }
.tarifas-switch a { padding: 6px 16px; border-radius: 999px; font-size: 13px; font-weight: 600; color: var(--muted); text-decoration: none; }
.tarifas-switch a:hover { color: var(--text); }
.tarifas-switch a.activo { background: var(--primario); color: #fff; }
.pestanas .cuenta.alerta { background: var(--amarillo); color: var(--text); font-weight: 700; }
.estado-reporte { display: inline-block; padding: 1px 9px; border-radius: 999px; font-size: 12px; font-weight: 600; background: var(--superficie); }
.estado-reporte.pendiente { background: var(--orange-bg); color: var(--orange); }
.estado-reporte.aprobada { background: var(--green-bg); color: var(--green); }
.estado-reporte.rechazada { color: var(--muted); }
.card.plano.reporte { padding: 14px 18px; margin-bottom: 10px; }
.reporte-cabeza { display: flex; gap: 6px 12px; align-items: baseline; flex-wrap: wrap; }
.reporte-comentario { margin: 6px 0 0; font-size: 13px; color: var(--muted); font-style: italic; }
.reporte-form { display: grid; grid-template-columns: 1.2fr 1fr 1.2fr 1.1fr .8fr 1fr auto; gap: 8px; align-items: end; margin-top: 10px; }
.reporte-form label { display: flex; flex-direction: column; gap: 3px; margin: 0; font-size: 11px; }
.reporte-form input { min-width: 0; }
.reporte-botones { display: flex; gap: 6px; }
@media (max-width: 900px) { .reporte-form { grid-template-columns: 1fr 1fr; } .reporte-botones { grid-column: 1 / -1; } }

/* ---- Portada (página de ingreso): software logístico para importar y exportar, red de agentes para los agentes.
   Fondo claro, tipografía grande, una sola banda oscura (la red) y el amarillo solo como acento. */
main.entrada { max-width: none; margin: 0; padding: 0; }
.lp-entrar { color: #fff; text-decoration: none; font-weight: 600; font-size: 13.5px; padding: 7px 16px; border: 1px solid #4a4a50; border-radius: 999px;
             transition: border-color .15s, background .15s, color .15s; }
.lp-entrar:hover { border-color: var(--amarillo); background: var(--amarillo); color: var(--text); }
.lp-caja { max-width: 1160px; margin: 0 auto; padding: 0 32px; }
.lp-eyebrow { display: block; font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.lp-eyebrow.claro { color: var(--amarillo); }

/* portada */
.lp-hero { position: relative; overflow: hidden; border-bottom: 1px solid var(--border);
           background: radial-gradient(circle at 85% 20%, rgba(254, 216, 53, .16), transparent 42%),
                       linear-gradient(var(--linea) 1px, transparent 1px) 0 0 / 100% 56px, var(--bg); }
.lp-hero-grilla { display: grid; grid-template-columns: 1.5fr 1fr; gap: 64px; align-items: center; padding-top: 72px; padding-bottom: 112px; }
.lp-hero h1 { font-family: var(--fuente-titulos); font-weight: 400; font-size: clamp(54px, 7.4vw, 96px); line-height: .92; letter-spacing: .01em;
              margin: 18px 0 22px; }
.lp-hero h1 em { font-style: normal; background: linear-gradient(transparent 64%, var(--amarillo) 64%); padding: 0 .04em; }
.lp-bajada { font-size: 17px; line-height: 1.6; color: #45454b; max-width: 540px; margin: 0 0 30px; }
.lp-bajar { display: inline-flex; align-items: center; gap: 12px; font-weight: 600; font-size: 14px; color: var(--text); text-decoration: none; }
.lp-bajar::after { content: "↓"; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%;
                   background: var(--carbon); color: var(--amarillo); font-weight: 700; transition: transform .2s; }
.lp-bajar:hover::after { transform: translateY(3px); }
.lp-ingreso { background: var(--card); border: 1px solid var(--border); border-radius: 14px; padding: 30px 30px 26px;
              box-shadow: 0 24px 60px rgba(20, 20, 25, .10); }
.lp-ingreso h2 { font-family: var(--fuente-titulos); font-weight: 400; font-size: 30px; letter-spacing: .03em; margin: 0; line-height: 1; }
.lp-ingreso > p { margin: 6px 0 20px; font-size: 13px; color: var(--muted); }
.lp-ingreso .btn { width: 100%; padding: 11px; margin-top: 4px; }

/* las tres puertas */
/* Las tres tarjetas comparten filas (subgrid): encabezado, título, bajada, lista y pie quedan a la misma altura en las tres. */
.lp-puertas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(5, auto); gap: 0 20px; margin-top: -56px; padding-bottom: 88px; position: relative; scroll-margin-top: 20px; }
.lp-puerta { display: grid; grid-row: span 5; grid-template-rows: subgrid; row-gap: 0; background: var(--card); border: 1px solid var(--border); border-radius: 14px; padding: 28px 28px 24px;
             transition: transform .2s, box-shadow .2s, border-color .2s; }
.lp-puerta:hover { transform: translateY(-3px); box-shadow: 0 18px 40px rgba(20, 20, 25, .09); }
.lp-puerta.elegida { border-color: var(--carbon); box-shadow: inset 0 0 0 1px var(--carbon), 0 18px 40px rgba(20, 20, 25, .09); }
.lp-puerta.oscura { background: var(--carbon); border-color: var(--carbon); color: #fff; }
.lp-puerta.oscura.elegida { box-shadow: inset 0 0 0 2px var(--amarillo), 0 18px 40px rgba(20, 20, 25, .18); }
.lp-puerta-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 26px; }
.lp-num { font-family: var(--fuente-titulos); font-size: 22px; letter-spacing: .06em; color: var(--suave); }
.lp-tag { font-size: 10.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px;
          background: var(--superficie); color: var(--muted); }
.lp-puerta.oscura .lp-tag { background: var(--amarillo); color: var(--text); }
.lp-puerta h2 { font-family: var(--fuente-titulos); font-weight: 400; font-size: 34px; line-height: 1; letter-spacing: .02em; margin: 0 0 12px; align-self: start; }
.lp-puerta-bajada { font-size: 14px; line-height: 1.55; color: var(--muted); margin: 0 0 22px; }
.lp-puerta.oscura .lp-puerta-bajada { color: #b9b9c0; }
.lp-puerta ul { list-style: none; margin: 0 0 28px; padding: 20px 0 0; align-content: start; border-top: 1px solid var(--linea); display: grid; gap: 11px; font-size: 13.5px; }
.lp-puerta.oscura ul { border-top-color: #38383d; }
.lp-puerta li, .lp-plan li { position: relative; padding-left: 22px; }
.lp-puerta li::before, .lp-plan li::before { content: ""; position: absolute; left: 1px; top: .45em; width: 9px; height: 5px; border: solid var(--text);
                                             border-width: 0 0 2px 2px; transform: rotate(-45deg); }
.lp-puerta.oscura li::before { border-color: var(--amarillo); }
.lp-puerta-pie { display: flex; flex-direction: column; gap: 14px; align-self: end; }
.lp-planes-chip { display: inline-flex; align-self: flex-start; border: 1px solid var(--border); border-radius: 999px; overflow: hidden; font-size: 11.5px; font-weight: 700; }
.lp-planes-chip span { padding: 4px 12px; }
.lp-planes-chip span + span { border-left: 1px solid var(--carbon); background: var(--carbon); color: var(--amarillo); }
.lp-puerta.oscura .lp-planes-chip { border-color: #4a4a50; color: var(--amarillo); }
.lp-cta { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 13px 20px; border-radius: 8px; font-weight: 700; font-size: 14px;
          text-decoration: none; background: var(--carbon); color: #fff; transition: background .15s, color .15s; }
.lp-cta::after { content: "→"; transition: transform .2s; }
.lp-cta:hover::after { transform: translateX(3px); }
.lp-cta:hover, .lp-puerta.elegida .lp-cta { background: var(--amarillo); color: var(--text); }
.lp-cta.amarillo, .lp-puerta.oscura .lp-cta { background: var(--amarillo); color: var(--text); }
.lp-cta.amarillo:hover, .lp-puerta.oscura .lp-cta:hover { background: #fff; }

/* la red de agentes, en pocas palabras */
.lp-red { background: var(--carbon); color: #fff; padding: 88px 0; }
.lp-red-cab { max-width: 720px; }
.lp-red h2 { font-family: var(--fuente-titulos); font-weight: 400; font-size: clamp(40px, 5vw, 60px); line-height: 1; letter-spacing: .01em; margin: 14px 0 16px; }
.lp-red h2 em { font-style: normal; color: var(--amarillo); }
.lp-red-cab p { color: #b9b9c0; font-size: 15.5px; margin: 0; }
.lp-red-pasos { list-style: none; margin: 52px 0 44px; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); }
.lp-red-pasos li { counter-increment: paso; position: relative; padding: 26px 26px 0 0; border-top: 1px solid #3d3d42; }
.lp-red-pasos { counter-reset: paso; }
.lp-red-pasos li::before { content: counter(paso, decimal-leading-zero); position: absolute; top: -9px; left: 0; padding-right: 10px; background: var(--carbon);
                           font-family: var(--fuente-titulos); font-size: 16px; letter-spacing: .08em; color: var(--amarillo); line-height: 1; }
.lp-red-pasos span { font-family: var(--fuente-titulos); font-size: 28px; letter-spacing: .03em; line-height: 1; }
.lp-red-pasos p { margin: 10px 0 0; color: #b9b9c0; font-size: 13.5px; line-height: 1.55; }

/* nuestros planes */
.lp-planes { padding-top: 88px; padding-bottom: 72px; }
.lp-seccion-cab { max-width: 640px; margin-bottom: 36px; }
.lp-seccion-cab h2 { font-family: var(--fuente-titulos); font-weight: 400; font-size: clamp(40px, 5vw, 56px); line-height: 1; margin: 12px 0 12px; letter-spacing: .01em; }
.lp-seccion-cab p { color: var(--muted); font-size: 15px; margin: 0; }
.lp-planes-grilla { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: stretch; }
.lp-plan { background: var(--card); border: 1px solid var(--border); border-radius: 14px; padding: 28px; display: flex; flex-direction: column; position: relative; }
.lp-plan.destacado { border-color: var(--carbon); box-shadow: inset 0 0 0 1px var(--carbon); }
.lp-plan.destacado::before { content: "Recomendado"; position: absolute; top: -11px; left: 28px; background: var(--amarillo); color: var(--text); font-size: 10.5px;
                             font-weight: 800; letter-spacing: .12em; text-transform: uppercase; padding: 3px 10px; border-radius: 999px; }
.lp-plan-nombre { font-family: var(--fuente-titulos); font-size: 40px; line-height: 1; letter-spacing: .02em; }
.lp-plan-precio { font-weight: 700; font-size: 14px; margin-top: 6px; }
.lp-plan-para { font-size: 12px; color: var(--muted); margin-top: 2px; padding-bottom: 18px; border-bottom: 1px solid var(--linea); }
.lp-plan ul { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 10px; font-size: 13.5px; }
.lp-plan li::before { border-color: var(--green); }
.lp-comparar { margin-top: 24px; background: var(--card); border: 1px solid var(--border); border-radius: 14px; }
.lp-comparar > summary { cursor: pointer; list-style: none; padding: 18px 28px; font-weight: 700; font-size: 14px; display: flex; justify-content: space-between; align-items: center; }
.lp-comparar > summary::-webkit-details-marker { display: none; }
.lp-comparar > summary::after { content: "+"; font-size: 20px; font-weight: 400; color: var(--muted); }
.lp-comparar[open] > summary::after { content: "−"; }
.lp-comparar .onb-tabla { padding: 0 16px 16px; }
.lp-comparar tbody th { text-transform: none; letter-spacing: 0; font-size: 13px; color: var(--text); background: none; font-weight: 500; }

/* pedido de acceso */
#acceso { scroll-margin-top: 20px; padding-bottom: 40px; }
.lp-acceso { display: grid; grid-template-columns: 1fr 1.2fr; gap: 32px; align-items: center; background: var(--carbon); color: #fff; border-radius: 14px; padding: 36px 40px; }
.lp-acceso h2 { font-family: var(--fuente-titulos); font-weight: 400; font-size: 40px; line-height: 1.05; letter-spacing: .02em; margin: 8px 0 8px; color: #fff; }
.lp-acceso p { color: #c9c9ce; margin: 0; }
.ent-form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ent-form .error { grid-column: 1 / -1; }
.ent-form input, .ent-form select { background: #2a2a2e; border-color: #3d3d42; color: #fff; }
.ent-form input::placeholder { color: #8d8d94; }
.ent-form .btn { justify-self: start; padding: 11px 22px; }
.ent-form select[hidden] { display: none; }
.ent-codigo { grid-column: 1 / -1; }
.ent-codigo > summary { display: inline-block; cursor: pointer; font-size: 13px; color: #c9c9ce; list-style: none; border-bottom: 1px dashed #6b6b72; }
.ent-codigo > summary::-webkit-details-marker { display: none; }
.ent-codigo > summary::before { content: "+ "; color: var(--amarillo); font-weight: 700; }
.ent-codigo[open] > summary::before { content: "− "; }
.ent-codigo[open] > summary { margin-bottom: 8px; }
.ent-codigo input { width: 100%; max-width: 320px; text-transform: uppercase; letter-spacing: .06em; }
.ent-trampa { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.lp-pie { display: flex; justify-content: space-between; gap: 8px 20px; flex-wrap: wrap; padding-top: 22px; padding-bottom: 28px;
          border-top: 1px solid var(--border); font-size: 12.5px; color: var(--muted); }
.lp-pie strong { color: var(--text); letter-spacing: .06em; }
.lp-pie a { color: var(--muted); text-decoration: none; }
.lp-pie a:hover { color: var(--text); }
.lp-ingreso h2, .lp-puerta h2, .lp-seccion-cab h2 { color: var(--text); }   /* el h2 general es chico y gris */
.lp-puerta.oscura h2, .lp-red h2 { color: #fff; }
@media (prefers-reduced-motion: reduce) { .lp-puerta, .lp-cta::after, .lp-bajar::after { transition: none; } }
@media (max-width: 980px) {
  .lp-hero-grilla { grid-template-columns: 1fr; gap: 36px; padding-top: 44px; padding-bottom: 48px; }
  .lp-puertas, .lp-planes-grilla { grid-template-columns: 1fr; }
  .lp-puertas { margin-top: 0; padding-top: 32px; grid-template-rows: none; }
  .lp-puerta { margin-bottom: 16px; }
  .lp-red-pasos { grid-template-columns: 1fr 1fr; row-gap: 36px; }
  .lp-acceso { grid-template-columns: 1fr; gap: 22px; padding: 28px 22px; }
}
@media (max-width: 600px) {
  .lp-caja { padding-left: 16px; padding-right: 16px; }
  .lp-bajada { font-size: 15.5px; }
  .lp-puerta, .lp-plan, .lp-ingreso { padding: 24px 20px 20px; }
  .lp-red, .lp-planes { padding-top: 64px; }
  .lp-red { padding-bottom: 64px; }
  .lp-red-pasos { grid-template-columns: 1fr; }
  .lp-comparar > summary { padding: 16px 20px; }
  .ent-form { grid-template-columns: 1fr; }
}

/* ---- Cuentas: solicitudes (acceso, Pro, agente) */
.solicitudes { margin: 0 0 24px; scroll-margin-top: 16px; }
.solicitudes-cabeza { display: flex; align-items: baseline; gap: 6px 14px; flex-wrap: wrap; margin-bottom: 10px; }
.solicitudes-cabeza h2 { margin: 0; display: flex; align-items: center; gap: 8px; }
.card.solicitud { display: grid; grid-template-columns: minmax(240px, 1fr) 1.6fr; align-items: start; gap: 18px 28px; padding: 18px 22px; margin-bottom: 10px;
                  border-left: 4px solid var(--amarillo); scroll-margin-top: 16px; }
.card.solicitud:target { box-shadow: 0 0 0 3px rgba(254, 216, 53, .55); }
.solicitud h3 { margin: 6px 0 2px; font-size: 17px; }
.solicitud-tipo { display: inline-block; font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
                  padding: 2px 8px; border-radius: 4px; background: var(--superficie); }
.solicitud-tipo.t-acceso { background: var(--amarillo); }
.solicitud-tipo.t-pro, .solicitud-tipo.t-agente { background: var(--green-bg); color: var(--green); }
.solicitud-generar { margin: 10px 0 0; font-size: 13px; }
.solicitud-acciones { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.solicitud-form { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px 10px; align-items: end; width: 100%; }
.solicitud-form label { display: flex; flex-direction: column; gap: 3px; margin: 0; font-size: 11px; }
.solicitud-form input, .solicitud-form select { min-width: 0; }
.solicitud-form .btn { justify-self: start; }
.solicitudes-historial ul { margin: 8px 0 0; padding-left: 18px; font-size: 13px; }
.card.credenciales { display: grid; gap: 10px; border-left: 4px solid var(--green); }
.card.credenciales textarea { font: 13px/1.5 var(--fuente); resize: none; background: var(--superficie); }
.card.credenciales .btn { justify-self: start; }
.chip-solicitud { background: #fff5c7; }
@media (max-width: 900px) { .card.solicitud { grid-template-columns: 1fr; } .solicitud-form { grid-template-columns: 1fr 1fr; } }

/* Tareas: la descripción larga se corta a 2 líneas (3 en la operación); un clic la muestra entera */
.tarea-texto { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; overflow-wrap: anywhere; cursor: pointer; }
.tablero-tareas .tarea-texto, .pagina-tareas .tarea-texto { -webkit-line-clamp: 2; line-clamp: 2; }
.tarea-texto.entera { display: block; -webkit-line-clamp: unset; line-clamp: none; }
.tarea-meta { min-width: 0; }

/* =====================================================================
   Prolijidad: nada se sale de su recuadro
   ===================================================================== */
.multi-panel { max-width: calc(100vw - 16px); }
@media (max-width: 760px) { details.filtro-multi .multi-panel, .multi-panel { min-width: min(260px, calc(100vw - 32px)); } }
table.tabla-responsiva td, .tarea-cuerpo, .solicitud h3, .card h2, .card h3 { overflow-wrap: anywhere; }
table.tabla-responsiva td.nombre, td.nombre { overflow-wrap: break-word; }   /* «anywhere» deja la columna más angosta que una palabra y la parte al medio */
.importar-leads > form input[type=file] { max-width: 100%; }
form.en-linea { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
form.en-linea input { flex: 1 1 120px; min-width: 0; }
/* Migas de pan en una sola línea (en el celular el nombre ya está en el título) */
.migas { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Historial: cada novedad en 2 líneas; un clic la muestra entera */
.historial .texto { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; overflow-wrap: anywhere; cursor: pointer; }
.historial .texto.entera { display: block; -webkit-line-clamp: unset; line-clamp: none; }
/* Selector de archivos con la estética de los botones de la app */
input[type=file] { font: inherit; font-size: 13px; color: var(--muted); max-width: 100%; }
input[type=file]::file-selector-button { font: inherit; font-size: 13px; font-weight: 600; padding: 7px 12px; margin-right: 10px; border: 1px solid var(--border);
                                         border-radius: 6px; background: #fff; color: var(--text); cursor: pointer; transition: background .15s; }
input[type=file]::file-selector-button:hover { background: var(--superficie); }
@media (max-width: 760px) {
  /* el texto que se corta con «…» arranca siempre por el principio */
  table.tabla-compacta td:nth-child(n+2) { text-align: left; }
}

/* =====================================================================
   Newsletter: datos del día (BCRA, feriados) y temas del Boletín
   ===================================================================== */
.nl-datos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(0, 1.5fr); gap: 10px; margin: -6px 0 22px; position: relative; }
.nl-dato { background: var(--card); border: 1px solid var(--border); border-radius: 10px; padding: 10px 14px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nl-dato-nombre { font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.nl-dato-valor { font-size: 19px; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }
.nl-dato-valor.chico { font-size: 16px; }
.nl-dato-var { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nl-dato-var.sube { color: var(--red); }
.nl-dato-var.baja { color: var(--green); }
.nl-feriados > summary { list-style: none; cursor: pointer; display: flex; flex-direction: column; gap: 2px; }
.nl-feriados > summary::-webkit-details-marker { display: none; }
.nl-feriados .nl-dato-nombre { white-space: nowrap; }
.nl-feriados > summary .nl-dato-var { white-space: normal; }
.nl-feriados[open] { grid-column: 1 / -1; }
.nl-feriados ul { margin: 10px 0 2px; padding: 0; list-style: none; display: grid; gap: 6px; font-size: 13px; }
.nl-feriados li .muted { margin-left: 6px; font-size: 12px; }
.nl-datos-fuente { grid-column: 1 / -1; font-size: 11px; color: var(--suave); margin-top: -4px; }
.bo-tema { display: inline-block; font-size: 10px; font-weight: 700; letter-spacing: .02em; text-transform: none; color: #5a4a00;
           background: #fff4c2; border-radius: 4px; padding: 1px 6px; margin-left: 6px; vertical-align: 1px; }
.bo-criterio .bo-tema { margin: 2px 4px 2px 0; }
.bo-criterio > summary { cursor: pointer; font-weight: 700; font-size: 13px; }
.bo-temas { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }
.bo-temas a { font-size: 12px; font-weight: 700; text-decoration: none; color: #55555c; border: 1px solid var(--border); background: var(--card);
              border-radius: 999px; padding: 5px 12px; }
.bo-temas a.activa { background: var(--carbon); border-color: var(--carbon); color: #fff; }
.nl-feriados .nl-dato-valor { overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 760px) { .nl-datos { grid-template-columns: repeat(2, minmax(0, 1fr)); } .nl-feriados { grid-column: 1 / -1; } }

/* =====================================================================
   Aranceles (NCM)
   ===================================================================== */
.ncm-buscador { display: flex; gap: 8px; margin: 0 0 18px; }
.ncm-buscador input { flex: 1; min-width: 0; font-size: 15px; padding: 11px 14px; }
.ncm-lista { padding: 6px 18px; }
.ncm-lista > h2 { margin: 12px 0 4px; }
.ncm-fila { display: grid; grid-template-columns: 96px minmax(0, 1fr) 64px auto; gap: 14px; align-items: center;
            padding: 11px 0; border-bottom: 1px solid var(--linea); }
.ncm-fila:last-child { border-bottom: 0; }
.ncm-fila.seguida .ncm-codigo { background: var(--amarillo); }
.ncm-codigo { font-variant-numeric: tabular-nums; font-weight: 800; font-size: 13px; background: var(--superficie);
              border-radius: 6px; padding: 3px 7px; justify-self: start; white-space: nowrap; }
.ncm-texto { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ncm-desc { font-weight: 600; font-size: 14px; line-height: 1.35; overflow-wrap: anywhere; }
.ncm-ruta { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ncm-aec { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.1; cursor: help; }
.ncm-aec strong { font-size: 17px; font-variant-numeric: tabular-nums; }
.ncm-aec small { font-size: 10px; font-weight: 700; letter-spacing: .08em; color: var(--muted); }
.ncm-acciones { display: flex; gap: 6px; align-items: center; }
.ncm-acciones form { margin: 0; }
.ncm-seguir, .ncm-vuce { font: inherit; font-size: 12px; font-weight: 700; white-space: nowrap; border: 1px solid var(--border);
                         background: var(--card); color: var(--text); border-radius: 999px; padding: 5px 11px; cursor: pointer; text-decoration: none; }
.ncm-seguir:hover, .ncm-vuce:hover { border-color: var(--text); }
.ncm-seguir.activo { background: var(--carbon); border-color: var(--carbon); color: var(--amarillo); }
.ncm-resultado-cabeza { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 4px 0 10px; }
.ncm-resultado-cabeza h2 { margin: 0; font-size: 15px; }
.ncm-partida { padding: 0; margin-bottom: 10px; }
.ncm-partida > summary { cursor: pointer; padding: 14px 18px; display: flex; gap: 10px; align-items: baseline; list-style: none; }
.ncm-partida > summary::-webkit-details-marker { display: none; }
.ncm-partida-titulo { flex: 1; min-width: 0; font-weight: 600; font-size: 14px; display: -webkit-box; -webkit-line-clamp: 2;
                      -webkit-box-orient: vertical; overflow: hidden; }
.ncm-partida[open] > summary .ncm-partida-titulo { display: block; }
.ncm-partida .ncm-lista { border-top: 1px solid var(--linea); }
.ncm-capitulos > summary, .ncm-alertas > summary { cursor: pointer; list-style: none; }
.ncm-capitulos > summary::-webkit-details-marker, .ncm-alertas > summary::-webkit-details-marker { display: none; }
.ncm-capitulos > summary h2::after, .ncm-alertas > summary h2::after { content: " ▾"; color: var(--muted); }
.ncm-capitulos > summary h2, .ncm-alertas > summary h2 { margin: 0; }
.ncm-cap-grilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px 18px; margin-top: 14px; }
.ncm-cap-grilla a { display: flex; gap: 10px; align-items: baseline; text-decoration: none; color: var(--text); padding: 6px 0;
                    border-bottom: 1px solid var(--linea); min-width: 0; }
.ncm-cap-grilla a:hover .ncm-cap-titulo { text-decoration: underline; }
.ncm-cap-num { font-weight: 800; font-size: 12px; color: var(--muted); width: 22px; flex: none; font-variant-numeric: tabular-nums; }
.ncm-cap-titulo { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ncm-alertas ul { list-style: none; padding: 0; margin: 12px 0; display: grid; gap: 10px; }
.ncm-alertas li { display: flex; flex-direction: column; gap: 2px; padding-left: 12px; border-left: 3px solid var(--border); }
.ncm-alertas li.nueva { border-left-color: var(--amarillo); }
.ncm-alertas li a { color: var(--text); text-decoration: none; font-size: 14px; }
.ncm-alertas li a:hover { text-decoration: underline; }
.cuenta-grupo.nueva { background: var(--amarillo); color: var(--text); }
.ncm-ayuda { font-size: 13px; margin: 0 0 14px; }
.ncm-nota { font-size: 12.5px; color: var(--muted); margin: 18px 0 6px; }
.ncm-nota summary { cursor: pointer; font-weight: 700; }
.ncm-nota p { margin: 8px 0 0; line-height: 1.55; max-width: 900px; }
@media (max-width: 760px) {
  .ncm-lista { padding: 4px 14px; }
  .ncm-fila { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "cod aec" "txt txt" "acc acc"; gap: 6px 10px; }
  .ncm-codigo { grid-area: cod; }
  .ncm-texto { grid-area: txt; }
  .ncm-aec { grid-area: aec; flex-direction: row; gap: 6px; align-items: baseline; }
  .ncm-acciones { grid-area: acc; }
}
.ncm-buscador { margin-bottom: 10px; }
.ncm-atajos { display: flex; gap: 8px; margin: 0 0 18px; flex-wrap: wrap; }
.ncm-capitulo { flex: 1 1 320px; min-width: 0; }
.ncm-atajos .btn { white-space: nowrap; }

/* Calculadora de tributos */
.calc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.calc .card { margin-bottom: 0; }
.calc h2 { margin-top: 0; }
.calc-posicion { display: flex; gap: 12px; align-items: flex-start; padding-bottom: 14px; margin-bottom: 14px; border-bottom: 1px solid var(--linea); }
.calc-grilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; }
.calc-grilla label { display: flex; flex-direction: column; gap: 5px; font-size: 13px; font-weight: 600; margin: 0; }
.calc-grilla label .chica { font-weight: 400; }
.calc-grilla .calc-check { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 8px; font-weight: 500; }
.calc-opciones { margin-top: 16px; border-top: 1px solid var(--linea); padding-top: 12px; }
.calc-opciones > summary { cursor: pointer; font-weight: 700; font-size: 13px; margin-bottom: 12px; }
.calc-total { background: var(--carbon); color: #fff; border-radius: 10px; padding: 14px 16px; margin-bottom: 14px; }
.calc-total div { display: flex; flex-direction: column; gap: 2px; }
.calc-total span { font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--amarillo); }
.calc-total strong { font-size: 26px; font-variant-numeric: tabular-nums; }
.calc-total small { color: #c9c9cf; font-size: 12px; }
.calc-tabla { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.calc-tabla th { text-align: left; font-size: 11px; color: var(--muted); font-weight: 700; padding: 6px 4px; border-bottom: 1px solid var(--border); }
.calc-tabla td { padding: 7px 4px; border-bottom: 1px solid var(--linea); }
.calc-tabla .num { text-align: right; white-space: nowrap; }
.calc-tabla tr.base td { font-weight: 700; background: var(--superficie); }
.calc-resumen { display: grid; gap: 6px; margin-top: 12px; font-size: 13px; }
.calc-resumen div { display: flex; justify-content: space-between; gap: 12px; }
.calc-resumen strong { font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 900px) { .calc { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 500px) { .calc-grilla { grid-template-columns: 1fr; } .calc-tabla th:nth-child(2), .calc-tabla td:nth-child(2) { display: none; } }

/* Calculadora: nota explicativa */
.calc-nota { margin-top: 20px; background: var(--card); border: 1px solid var(--border); border-radius: var(--radio); padding: 22px 24px; }
.calc-nota h2 { margin: 18px 0 12px; }
.calc-nota-aviso { display: flex; gap: 12px; align-items: flex-start; background: var(--orange-bg); border: 1px solid #f1dfa6;
                   border-radius: 10px; padding: 12px 14px; }
.calc-nota-aviso p { margin: 0; font-size: 13.5px; line-height: 1.5; }
.calc-nota-icono { flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--orange); color: #fff; font-weight: 800;
                   font-size: 13px; display: grid; place-items: center; font-family: Georgia, serif; font-style: italic; }
.calc-pasos { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; counter-reset: none; }
.calc-pasos li { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; background: var(--superficie);
                 border-radius: 10px; font-size: 13px; line-height: 1.5; }
.calc-pasos li strong { font-size: 14px; }
.calc-paso-num { width: 24px; height: 24px; border-radius: 50%; background: var(--carbon); color: var(--amarillo); font-weight: 800;
                 font-size: 12px; display: grid; place-items: center; }
.calc-formula { font-size: 12px; font-weight: 700; color: var(--text); background: var(--card); border: 1px dashed var(--border);
                border-radius: 6px; padding: 4px 8px; align-self: flex-start; }
.calc-nota-pie { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 18px; margin-top: 18px; padding-top: 16px;
                 border-top: 1px solid var(--linea); align-items: start; }
.calc-nota-pie h3 { margin: 0 0 8px; font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); }
.calc-nota-pie p { margin: 0; line-height: 1.5; }
.calc-chips { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.calc-chips li { font-size: 12px; border: 1px solid var(--border); border-radius: 999px; padding: 3px 10px; background: var(--card); }
.calc-chips li::before { content: "✕ "; color: var(--red); font-weight: 700; }
@media (max-width: 900px) { .calc-pasos, .calc-nota-pie { grid-template-columns: minmax(0, 1fr); } .calc-nota { padding: 18px 16px; } }

/* Aranceles: acceso destacado a la calculadora */
.calc-banner { display: flex; align-items: center; gap: 18px; background: var(--carbon); color: #fff; text-decoration: none;
               border-radius: 14px; padding: 20px 24px; margin: 0 0 18px; border-left: 5px solid var(--amarillo);
               box-shadow: 0 8px 24px rgba(20, 20, 25, .12); transition: transform .15s, box-shadow .15s; }
.calc-banner:hover { transform: translateY(-1px); box-shadow: 0 12px 28px rgba(20, 20, 25, .18); }
.calc-banner-icono { flex: none; width: 52px; height: 52px; border-radius: 12px; background: var(--amarillo); color: var(--carbon);
                     display: grid; place-items: center; }
.calc-banner-texto { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.calc-banner-etiqueta { font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--amarillo); }
.calc-banner-titulo { font-family: "Bebas Neue", var(--fuente); font-size: 30px; line-height: 1; letter-spacing: .02em; }
.calc-banner-bajada { font-size: 13.5px; color: #c9c9cf; line-height: 1.45; }
.calc-banner-cta { flex: none; background: var(--amarillo); color: var(--carbon); font-weight: 800; font-size: 14px; border-radius: 8px;
                   padding: 11px 18px; white-space: nowrap; }
.calc-banner:hover .calc-banner-cta { background: var(--amarillo-h); }
.calc-banner.compacto { padding: 10px 14px; gap: 12px; border-radius: 10px; }
.calc-banner.compacto .calc-banner-icono { width: 36px; height: 36px; border-radius: 9px; }
.calc-banner.compacto .calc-banner-icono svg { width: 20px; height: 20px; }
.calc-banner.compacto .calc-banner-titulo { font-size: 20px; }
.calc-banner.compacto .calc-banner-bajada { display: none; }
.calc-banner.compacto .calc-banner-cta { padding: 7px 12px; font-size: 13px; }
@media (max-width: 760px) {
  .calc-banner { flex-wrap: wrap; padding: 16px; gap: 12px; }
  .calc-banner-titulo { font-size: 24px; }
  .calc-banner-cta { width: 100%; text-align: center; }
  .calc-banner.compacto .calc-banner-cta { width: auto; }
  .calc-banner.compacto { flex-wrap: nowrap; }
}

/* Menú: Operaciones agrupa Tareas, Proyectos y Exportables (se despliega al pasar el mouse) */
.menu-grupo { position: relative; display: flex; align-items: stretch; }
.menu-flecha { width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor;
               opacity: .7; margin-left: 1px; transition: transform .15s; }
.menu-grupo:hover .menu-flecha, .menu-grupo:focus-within .menu-flecha { transform: rotate(180deg); }
.submenu { display: none; position: absolute; top: 100%; left: 0; z-index: 50; min-width: 220px; margin-top: 3px; padding: 6px;
           background: var(--carbon); border: 1px solid #34343a; border-top: 2px solid var(--amarillo); border-radius: 0 0 10px 10px;
           box-shadow: 0 14px 30px rgba(0, 0, 0, .35); flex-direction: column; }
.menu-grupo:hover .submenu, .menu-grupo:focus-within .submenu { display: flex; }
.submenu::before { content: ""; position: absolute; left: 0; right: 0; top: -8px; height: 8px; }  /* puente para no perder el hover */
nav.menu .submenu a.item { padding: 9px 12px; margin: 0; border: 0; border-radius: 6px; justify-content: space-between; font-size: 13.5px; }
nav.menu .submenu a.item:hover { background: rgba(255, 255, 255, .07); }
nav.menu .submenu a.item.activo { color: var(--amarillo); background: rgba(254, 216, 53, .08); }
nav.menu a.item.bloqueado { color: #8a8a92; }
nav.menu a.item.bloqueado:hover { color: #c9c9cf; }
nav.menu a.item.bloqueado .menu-candado { opacity: .9; }
@media (max-width: 760px) {
  .menu-grupo { flex-direction: column; }
  .menu-flecha { display: none; }
  .submenu { display: flex; position: static; margin: 0 0 4px 14px; padding: 0; min-width: 0; background: none; border: 0;
             border-left: 1px solid #333338; border-radius: 0; box-shadow: none; }
  nav.menu .submenu a.item { padding: 9px 12px; font-size: 14px; justify-content: flex-start; }
}
/* Encabezado en una sola línea: un nombre de empresa largo se corta con «…» (completo al pasar el mouse) */
@media (min-width: 761px) {
  header { flex-wrap: nowrap; }
  header:has(.sub-admin) { flex-wrap: wrap; }
  .logo { min-width: 0; max-width: 300px; flex-shrink: 1; }
  .logo .nombre, .logo .bajada { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  nav.menu { flex-wrap: nowrap; min-width: 0; }
  nav.menu a.item { white-space: nowrap; }
  .acciones, .acciones-extra { flex: none; }
}
@media (min-width: 761px) and (max-width: 1280px) { .logo { max-width: 190px; margin-right: 12px; } }
.menu-grupo { flex: none; }
nav.menu a.item.grupo-titulo { white-space: nowrap; }
@media (min-width: 761px) {
  header.dos-filas { flex-wrap: wrap; }
  header.dos-filas .logo { flex: 1 1 0; max-width: none; margin-right: 12px; }
  header.dos-filas nav.menu { order: 4; flex: 1 0 100%; height: 42px; border-top: 1px solid #2c2c31; margin: 0 -28px; padding: 0 16px; }
  header.dos-filas .sub-admin { order: 5; }
}
@media (min-width: 761px) and (max-width: 1440px) { header.dos-filas nav.menu { margin: 0 -18px; padding: 0 9px; } }
@media (max-width: 760px) {
  .logo { flex: 1 1 0; min-width: 0; }
  .logo .nombre, .logo .bajada { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}
.reporte-bloqueado { max-width: 640px; }
.reporte-bloqueado h2 { margin: 10px 0 6px; }
.reporte-bloqueado p { margin: 0 0 14px; line-height: 1.55; }
[data-panel] .menu-candado { display: inline-block; vertical-align: 0; margin-left: 7px; color: var(--muted); }

/* ---------------------------------------------------------------- gestión de arribo (ficha de la operación) */
.arribo { padding: 18px 22px; }
.arribo-cabeza { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.arribo-cabeza h2 { margin: 0; font-size: 15px; }
.arribo-avance { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 160px; max-width: 320px; }
.arribo-barra { flex: 1; height: 8px; background: var(--superficie); border-radius: 99px; overflow: hidden; }
.arribo-barra span { display: block; height: 100%; background: var(--amarillo); border-radius: 99px; }
.arribo-avance strong { font-size: 13px; min-width: 38px; }
.pill-dias { font-size: 12.5px; font-weight: 600; padding: 3px 10px; border-radius: 99px; background: var(--superficie); color: var(--text); }
.pill-dias.amarillo { background: var(--orange-bg); color: var(--orange); }
.pill-dias.rojo { background: var(--red-bg); color: var(--red); }
.pill-dias.ok { background: var(--green-bg); color: var(--green); }
.arribo-texto { margin: 0 0 10px; font-size: 15px; font-weight: 700; }
.arribo-respuesta, .arribo-eta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.arribo-eta { margin-top: 10px; }
.arribo-campo { display: flex; align-items: center; gap: 8px; margin: 0; }
.arribo-campo > span { font-size: 12px; font-weight: 700; color: var(--muted); white-space: nowrap; }
.arribo-campo input { width: auto; min-width: 150px; }
.arribo-canal .canal-verde { border-left: 4px solid #1f9d55; }
.arribo-canal .canal-naranja { border-left: 4px solid #e8891c; }
.arribo-canal .canal-rojo { border-left: 4px solid #d0342c; }
.arribo-fin { margin: 0; font-weight: 700; color: var(--green); }
.arribo-detalle { margin-top: 14px; border-top: 1px solid var(--linea); padding-top: 10px; }
.arribo-detalle > summary { cursor: pointer; font-size: 13px; color: var(--muted); }
.arribo-pasos { list-style: none; margin: 10px 0 0; padding: 0; }
.arribo-pasos > li { display: flex; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--linea); font-size: 13.5px; }
.arribo-pasos > li:last-child { border-bottom: 0; }
.arribo-pasos > li.pendiente { color: var(--muted); }
.arribo-icono { width: 18px; text-align: center; font-weight: 700; color: var(--suave); }
.arribo-pasos .hecho .arribo-icono { color: var(--green); }
.arribo-paso-cuerpo { flex: 1; min-width: 0; }
.arribo-dato { margin-left: 6px; font-weight: 600; color: var(--text); }
.arribo-editar > summary { display: inline; cursor: pointer; font-size: 12.5px; list-style: none; }
.arribo-editar > summary::-webkit-details-marker { display: none; }
.arribo-editar[open] > summary { display: block; margin-bottom: 8px; }
.arribo-pasos .nota-canal { display: block; border: 0; }
@media (max-width: 600px) {
  .arribo { padding: 16px; }
  .arribo-avance { max-width: none; flex-basis: 100%; }
  .arribo-campo { flex-basis: 100%; }
  .arribo-campo input { flex: 1; min-width: 0; }
}

/* ---------------------------------------------------------------- editar tarea (lápiz) */
.tarea-editar { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.te-fila { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.te-fila select { flex: 1 1 180px; width: auto; min-width: 0; }
.te-fila input[type=date] { width: auto; }
.te-fila .segmentado span { padding: 6px 10px; font-size: 12.5px; }
.link-editar:hover { background: var(--superficie); color: var(--text); }

/* ---------------------------------------------------------------- costeo estándar */
.sinc-intro { margin: 0 0 16px; color: var(--muted); max-width: 760px; }
.sinc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.sinc .card { margin-bottom: 0; }
.sinc h2 { margin-top: 0; }
.sinc-fila { margin-bottom: 14px; }
.sinc-fila .segmentado { flex-wrap: wrap; }
.sinc .sinc-ancho { grid-column: 1 / -1; }
.sinc-tabla td:first-child { line-height: 1.35; }
.sinc-det { display: block; font-size: 11.5px; color: var(--muted); }
.sinc-tabla tr.sinc-falta td { color: var(--orange); }
.sinc-tabla td[title]:not([title=""]) { cursor: help; }
.sinc-aviso { margin: 20px 0; }
.sinc-editar { margin-top: 20px; }
.sinc-editar > summary { cursor: pointer; }
.sinc-editar form { margin-top: 14px; }
.sinc-editar .btn { margin-top: 14px; }
.sinc-valores { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; }
.sinc-valores label { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; margin: 0; }
.sinc-valores input { width: 80px; padding: 5px 7px; }
@media (max-width: 900px) { .sinc { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 500px) { .sinc-tabla td:nth-child(2) { display: table-cell; } }
.costeo-presu > summary { cursor: pointer; }
.costeo-presu[open] > summary { margin-bottom: 10px; }
.costeo-presu .costeo-carga { margin: 6px 0 14px; flex-wrap: wrap; }
.costeo-aplicar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 14px; }
.costeo-tarifa { margin: 0; font-size: 13px; align-self: end; }

/* Formularios de dos columnas (calculadora, costeo): el nombre y su aclaración en un renglón, y las casillas
   alineadas abajo aunque el nombre ocupe dos renglones. */
.calc-grilla { align-items: end; }
.calc-grilla > label:not(.calc-check) { display: block; line-height: 1.35; }
.calc-grilla > label:not(.calc-check) > input, .calc-grilla > label:not(.calc-check) > select { display: block; width: 100%; margin-top: 6px; }
.calc-grilla > label .chica { font-weight: 400; }
.calc-grilla .calc-check { display: flex; align-self: center; }
.costeo-total-flete { display: block; margin-top: 5px; min-height: 1.35em; }

/* Celular: presupuesto con concepto e importe en el mismo renglón y el detalle abajo; grillas sin columnas fantasma;
   selector FCL / LCL en dos mitades parejas. */
@media (max-width: 700px) {
  .presu-tabla tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; align-items: center; }
  .presu-tabla td:first-child { grid-column: 1; grid-row: 1; }
  .presu-tabla td:last-child { grid-column: 2; grid-row: 1; justify-self: end; max-width: 150px; }
  .presu-tabla td:nth-child(2):not(:last-child) { grid-column: 1 / -1; grid-row: 2; }
  .presu-tabla tr.subtotal { border-top: 2px solid var(--text); }
  .presu-tabla tr.subtotal td { border-top: 0; }
  .presu-tabla td:last-child input { width: 130px; }
  .grid > * { grid-column: auto !important; }
}
.sinc-fila .segmentado, .costeo-presu .costeo-carga { display: flex; max-width: 520px; }
.sinc-fila .segmentado label, .costeo-presu .costeo-carga label { flex: 1 1 0; }
.sinc-fila .segmentado span, .costeo-presu .costeo-carga span { text-align: center; height: 100%; display: flex; align-items: center; justify-content: center; }
@media (max-width: 600px) {
  .arribo-campo { flex-direction: column; align-items: stretch; gap: 4px; }
  .arribo-campo input { width: 100%; }
  .arribo-respuesta .btn { flex: 0 0 auto; }
}
.link-editar { display: inline-flex; align-items: center; justify-content: center; }
.link-editar svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* Proyecto: los botones de cotizar en una fila pareja. Presupuesto: el tilde alineado con las casillas.
   Fecha: misma altura que el resto de las casillas. */
.botones-cotizar { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.botones-cotizar .btn { margin: 0; }
.campo-check .opcion { display: flex; align-items: center; gap: 8px; min-height: 38px; margin: 0; }
input[type=date] { padding-top: 7px; padding-bottom: 7px; }

/* Inicio: los chips siempre debajo del número, a la misma altura en toda la fila. */
.seccion-chips { margin-top: 0; }
/* Próxima tarea en las listas: hasta dos renglones (el texto completo, al pasar el mouse), así las filas no se estiran. */
.accion-corta { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-width: 160px; }

@media (max-width: 760px) {
  /* Proyectos en celular: cliente y estado arriba; la solicitud y la próxima tarea debajo, alineadas a la izquierda. */
  table.tabla-proyectos td:nth-child(2) { order: 3; flex: 1 1 100%; margin-left: 0; color: var(--muted); }
  table.tabla-proyectos td:nth-child(3) { order: 2; flex: 0 1 auto; margin-left: auto; white-space: nowrap; color: inherit; }
  table.tabla-proyectos td:nth-child(3) .meta { display: none; }
  table.tabla-proyectos td:nth-child(4) { order: 4; }
  table.tabla-compacta td .accion-corta { display: inline; -webkit-line-clamp: unset; min-width: 0; }
}
@media (max-width: 500px) {
  /* Inicio en celular: íconos y títulos más chicos; los números a la misma altura; chips en un renglón. */
  .seccion-tarjeta { padding: 16px; gap: 10px; min-height: 0; }
  .seccion-cabeza { gap: 8px; min-height: 36px; }
  .seccion-icono { width: 30px; height: 30px; border-radius: 9px; }
  .seccion-icono svg { width: 17px; height: 17px; }
  .seccion-nombre { font-size: 18px; }
  .seccion-cifra { font-size: 28px; }
  .seccion-chip { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  .campo-check > label:first-child { display: none; }
}
@media (max-width: 760px) {
  table.tabla-proyectos td:nth-child(2), table.tabla-proyectos td:nth-child(4) { display: block; }
  table.tabla-proyectos td:nth-child(2) > *, table.tabla-proyectos td:nth-child(4) > * { justify-self: start; text-align: left; }
}

/* Proyectos: la última cotización y el presupuesto con tributos de cada proyecto, a un clic del PDF. */
.docs-proyecto { white-space: nowrap; }
.doc-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: var(--text); text-decoration: none;
            background: var(--superficie); border: 1px solid var(--border); border-radius: 6px; padding: 3px 9px; margin: 1px 0; }
.doc-chip:hover { border-color: var(--amarillo); background: #fffbea; }
.doc-chip-tipo { font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.doc-chip-pre .doc-chip-tipo { color: var(--green); }
.doc-mas { font-size: 11.5px; color: var(--muted); margin-left: 5px; }
.doc-linea + .doc-linea { margin-top: 4px; }
@media (max-width: 760px) {
  table.tabla-proyectos td:nth-child(4) { order: 4; flex: 1 1 100%; display: block; white-space: normal; color: inherit; overflow: visible; }
  table.tabla-proyectos td:nth-child(4) > * { justify-self: start; text-align: left; }
  table.tabla-proyectos td:nth-child(4) .doc-linea { display: inline-block; margin: 4px 8px 0 0; }
  table.tabla-proyectos td:nth-child(5) { order: 5; display: block; }
  table.tabla-proyectos td:nth-child(5) > * { justify-self: start; text-align: left; }
}

/* Presupuesto: gastos hasta FOB informativos (compra FOB u otro incoterm): se ven, pero no suman. */
.presu-tabla tr.informativo td:first-child { color: var(--muted); }
.presu-tabla tr.informativo input { color: var(--muted); background: var(--superficie); text-decoration: none; font-style: italic; }
.presu-totales .idx-principal { font-weight: 800; color: var(--text); font-size: 14.5px; }

/* Proyecto: «Pedir cotización a NETWISE», el gancho comercial, arriba de las cotizaciones. */
.cta-netwise { display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap;
               background: var(--carbon); color: #fff; border-radius: 10px; padding: 18px 20px; margin: 0 0 18px;
               border-left: 5px solid var(--amarillo); }
.cta-netwise-texto { display: flex; flex-direction: column; gap: 4px; flex: 1 1 300px; min-width: 0; }
.cta-netwise-etiqueta { font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--amarillo); }
.cta-netwise-texto strong { font-family: var(--fuente-titulos); font-size: 24px; letter-spacing: .03em; line-height: 1.05; font-weight: 400; }
.cta-netwise-texto > span:last-child { font-size: 13px; color: #c9c9cf; line-height: 1.45; }
.cta-netwise-boton { font-size: 15px; padding: 11px 18px; white-space: nowrap; box-shadow: 0 6px 18px rgba(254, 216, 53, .25); }
.cta-netwise-boton:hover { transform: translateY(-1px); }
@media (max-width: 600px) { .cta-netwise-boton { width: 100%; justify-content: center; } }

/* Calculadora: «¿Para qué es la mercadería?» a la vista, con su aclaración. */
.calc-grilla > label.calc-destino { grid-column: 1 / -1; }
.calc-destino-nota { display: block; margin-top: 6px; font-size: 12.5px; font-weight: 500; color: var(--green); }
.calc-destino-nota:empty { display: none; }
.campo-check { display: flex; flex-direction: column; }
.campo-check .opcion + .opcion { min-height: 0; margin-top: 2px; }

/* Presupuesto en pantalla: de dónde sale cada dato. */
.fuente-dato { display: inline-block; font-size: 9.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 1px 5px;
               border-radius: 4px; vertical-align: 1px; margin-left: 4px; border: 1px solid; white-space: nowrap; cursor: help; }
.fuente-dato.f-mercado { color: #1f5fa8; border-color: #9dbbe0; background: #eef4fb; }
.fuente-dato.f-simulado { color: var(--orange); border-color: #e6c77a; background: var(--orange-bg); }
.fuente-dato.f-cotizacion { color: var(--green); border-color: #93cdb6; background: var(--green-bg); }
.fuente-dato.f-manual { color: #44444a; border-color: #c9c7c0; background: var(--superficie); }
.fuente-dato.f-calculado { color: var(--muted); border-color: var(--border); background: #fff; }
.fuente-fila { display: block; margin-top: 3px; }
.fuente-fila .fuente-dato { margin-left: 0; }

/* Pedir cotización: «Mis pedidos» desplegable (se abre solo si hay una cotización para revisar). */
.pedidos-desplegable > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; user-select: none; }
.pedidos-desplegable > summary::-webkit-details-marker { display: none; }
.pedidos-desplegable[open] > summary { margin-bottom: 14px; }
.pedidos-titulo { font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.pedidos-desplegable .cuenta { font-size: 11px; font-weight: 700; color: var(--muted); background: var(--superficie); border-radius: 999px; padding: 1px 8px; }
.pedidos-alerta { font-size: 11.5px; font-weight: 700; color: var(--orange); background: var(--orange-bg); border-radius: 999px; padding: 2px 9px; }
.pedidos-flecha { margin-left: auto; width: 8px; height: 8px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted);
                  transform: rotate(45deg); transition: transform .15s; margin-right: 4px; }
.pedidos-desplegable[open] .pedidos-flecha { transform: rotate(-135deg); }

/* Pedir cotización: formulario por pasos y tipo de envío con un selector segmentado. */
.cot-form { padding: 0; overflow: hidden; }
.cot-cabeza { padding: 22px 26px 4px; }
.cot-cabeza h2 { margin: 0 0 4px; }
.cot-cabeza p { margin: 0; font-size: 13px; color: var(--muted); }
.cot-form .req { color: var(--red); font-weight: 700; }
.cot-nota { margin: 12px 26px 0; padding: 10px 12px; font-size: 12.5px; color: var(--muted); background: var(--superficie); border-radius: 8px; }
.cot-paso { padding: 18px 26px 6px; }
.cot-paso + .cot-paso { border-top: 1px solid var(--linea); }
.cot-paso-tit { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; font-size: 12px; font-weight: 800; letter-spacing: .1em;
                text-transform: uppercase; color: var(--text); }
.cot-n { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%;
         background: var(--carbon); color: var(--amarillo); font-size: 11px; letter-spacing: 0; }
.cot-opcional { font-size: 11.5px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--suave); }
.cot-grilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; margin-bottom: 14px; }
.cot-grilla-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cot-form .campo { margin-bottom: 14px; }
.cot-enviar { display: flex; align-items: center; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap;
              padding: 16px 26px; background: var(--superficie); border-top: 1px solid var(--border); margin-top: 8px; }
.cot-enviar p { margin: 0; font-size: 12.5px; color: var(--muted); flex: 1 1 240px; }
.cot-enviar .btn { padding: 11px 22px; font-size: 14.5px; }

.envio-modos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.envio-modo { position: relative; display: flex; align-items: center; gap: 12px; text-align: left; font: inherit; color: var(--text);
              background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 13px 14px; cursor: pointer;
              transition: border-color .15s, box-shadow .15s, background .15s; }
.envio-modo:hover { border-color: #c9c6be; background: var(--hover); }
.envio-modo svg { flex: none; width: 34px; height: 34px; padding: 7px; border-radius: 9px; background: var(--superficie);
                  fill: none; stroke: var(--primario); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; transition: background .15s, stroke .15s; }
.envio-modo-texto { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.envio-modo-texto strong { font-size: 14px; }
.envio-modo-texto small { font-size: 11.5px; color: var(--muted); line-height: 1.3; }
.envio-check { position: absolute; top: 9px; right: 9px; width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid var(--border); }
.envio-modo.abierto { border-color: var(--primario); box-shadow: 0 0 0 1px var(--primario); }
.envio-modo.abierto svg, .envio-modo.activo svg { background: var(--carbon); stroke: var(--amarillo); }
.envio-modo.activo .envio-check { border-color: var(--primario); background: var(--primario); }
.envio-modo.activo .envio-check::after { content: ""; position: absolute; left: 4.5px; top: 1.5px; width: 4px; height: 8px;
                                         border: solid var(--amarillo); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.envio-variantes { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.envio-variantes-tit { font-size: 12.5px; font-weight: 600; color: var(--muted); }
.envio-seg { display: inline-flex; background: var(--superficie); border-radius: 9px; padding: 3px; gap: 2px; }
.envio-variante { font: inherit; font-size: 13px; font-weight: 600; color: #55555c; background: transparent; border: 0; border-radius: 7px;
                  padding: 7px 16px; cursor: pointer; transition: background .15s, color .15s; }
.envio-variante:hover { color: var(--text); }
.envio-variante.activo { background: #fff; color: var(--text); box-shadow: 0 1px 3px rgba(20, 20, 25, .14); }
.cot-equipo { margin-top: 14px; }
.cot-equipo > div:not([hidden]) { margin-bottom: 14px; }
.cot-equipo .contenedores { margin: 0 0 14px; }
@media (max-width: 700px) {
  .cot-cabeza, .cot-paso { padding-left: 16px; padding-right: 16px; }
  .cot-nota { margin-left: 16px; margin-right: 16px; }
  .cot-enviar { padding: 14px 16px; }
  .cot-enviar .btn { width: 100%; justify-content: center; }
  .envio-modos { grid-template-columns: 1fr; gap: 8px; }
  .envio-modo { padding: 11px 12px; }
  .cot-grilla, .cot-grilla-3 { grid-template-columns: 1fr; }
}
.cot-layout { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); }
.cot-paso-tit { flex-wrap: wrap; row-gap: 2px; }
@media (max-width: 1000px) { .cot-layout { grid-template-columns: 1fr; } }

/* Pedir cotización: valor de la mercadería con el «USD» adelante. */
.cot-grilla-mercaderia { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); margin-bottom: 6px; }
.campo-usd { display: flex; align-items: stretch; }
.campo-usd > span { display: flex; align-items: center; padding: 0 10px; font-size: 12px; font-weight: 700; color: var(--muted);
                    background: var(--superficie); border: 1px solid var(--border); border-right: 0; border-radius: 6px 0 0 6px; }
.campo-usd input { border-radius: 0 6px 6px 0; }
.cot-ayuda { margin: 0 0 14px; font-size: 12px; color: var(--muted); }
@media (max-width: 700px) { .cot-grilla-mercaderia { grid-template-columns: 1fr; } }

/* Aviso emergente (p. ej. empresa Free que acepta una cotización). */
.aviso-modal { position: fixed; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center; padding: 16px;
               background: rgba(20, 20, 25, .55); }
.aviso-modal-caja { background: var(--card); border-radius: 14px; padding: 28px 26px 22px; max-width: 440px; width: 100%; text-align: center;
                    box-shadow: 0 20px 50px rgba(0, 0, 0, .3); border-top: 5px solid var(--amarillo); }
.aviso-modal-icono { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%;
                     background: var(--green-bg); color: var(--green); font-size: 24px; font-weight: 800; }
.aviso-modal-caja h2 { margin: 12px 0 8px; font-size: 18px; }
.aviso-modal-caja p { margin: 0 0 18px; color: #44444a; line-height: 1.55; }

/* ---- Carátula de la empresa: el camino Proyecto › Tareas › Presupuesto › Operación */
.card.camino { max-width: none; margin: 0 0 20px; padding: 22px 24px; border-top: 3px solid var(--amarillo); }
.camino-cabeza { display: flex; align-items: baseline; justify-content: space-between; gap: 6px 16px; flex-wrap: wrap; margin-bottom: 16px; }
.camino-cabeza h2 { margin: 0; }
.camino-proyecto { font-size: 13px; color: var(--muted); text-decoration: none; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.camino-proyecto strong { color: var(--text); }
.camino-proyecto:hover strong { text-decoration: underline; }
.camino-pasos { list-style: none; margin: 0 0 18px; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); counter-reset: none; }
.camino-pasos li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; font-size: 13px; color: var(--muted); }
.camino-pasos li::before { content: ""; position: absolute; top: 15px; left: -50%; right: 50%; height: 2px; background: var(--border); z-index: 0; }
.camino-pasos li:first-child::before { display: none; }
.camino-pasos li.hecho::before, .camino-pasos li.actual::before { background: var(--carbon); }
.camino-num { position: relative; z-index: 1; width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
              font-weight: 700; font-size: 14px; background: var(--card); border: 2px solid var(--border); color: var(--muted); }
.camino-pasos li.hecho .camino-num { background: var(--carbon); border-color: var(--carbon); color: #fff; }
.camino-pasos li.actual .camino-num { background: var(--amarillo); border-color: var(--carbon); color: var(--text); box-shadow: 0 0 0 4px rgba(254, 216, 53, .35); }
.camino-pasos li.actual .camino-nombre { color: var(--text); font-weight: 700; }
.camino-pasos li.hecho .camino-nombre { color: var(--text); }
.camino-pro { display: inline-block; font-size: 9.5px; font-weight: 800; letter-spacing: .06em; padding: 1px 5px; border-radius: 3px; background: var(--superficie);
              color: var(--muted); vertical-align: 1px; }
.camino-ahora { background: var(--superficie); border-radius: var(--radio); padding: 16px 18px; }
.camino-ahora h3 { margin: 0 0 6px; font-size: 16px; }
.camino-ahora p { margin: 0 0 8px; }
.camino-tareas { margin: 4px 0 10px; padding-left: 18px; font-size: 13.5px; }
.camino-tareas li { margin-bottom: 3px; }
.camino-acciones { display: flex; align-items: center; gap: 8px 16px; flex-wrap: wrap; margin-top: 12px; }
@media (max-width: 600px) {
  .card.camino { padding: 18px 16px; }
  .camino-pasos li { font-size: 11.5px; }
  .camino-num { width: 28px; height: 28px; font-size: 13px; }
  .camino-pasos li::before { top: 13px; }
}

/* ---- Importación / exportación: elección en Pedir cotización, chip en el proyecto y precio de venta */
.sentido-opciones { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sentido-opcion { position: relative; margin: 0; cursor: pointer; }
.sentido-opcion input { position: absolute; opacity: 0; pointer-events: none; }
.sentido-opcion > span { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 12px; align-items: center;
                         padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--radio); background: var(--card); transition: border-color .15s, box-shadow .15s; }
.sentido-opcion svg { grid-row: 1 / 3; width: 22px; height: 22px; fill: none; stroke: var(--text); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.sentido-opcion strong { font-size: 15px; }
.sentido-opcion small { color: var(--muted); font-size: 12.5px; }
.sentido-opcion:hover > span { border-color: var(--carbon); }
.sentido-opcion input:checked + span { border-color: var(--carbon); box-shadow: inset 0 0 0 1px var(--carbon); background: #fffbea; }
.sentido-opcion input:focus-visible + span { outline: 2px solid var(--carbon); outline-offset: 2px; }
.incoterm-venta { margin-top: 14px; max-width: 420px; }
.incoterm-venta[hidden] { display: none; }
.incoterm-venta select { width: 100%; }
.sentido-chip { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .04em; padding: 2px 8px; border-radius: 4px; margin-right: 4px;
                background: var(--superficie); color: var(--text); vertical-align: 1px; }
.sentido-chip.s-exportacion { background: #e6f0fb; color: #1d4f86; }
.precio-venta { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--linea); scroll-margin-top: 16px; }
.precio-venta h3 { margin: 0 0 4px; }
.pv-campos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 12px; margin: 12px 0 14px; }
.pv-campos label { display: flex; flex-direction: column; gap: 4px; margin: 0; font-size: 12px; font-weight: 600; }
.pv-campos select, .pv-campos input { min-width: 0; }
.pv-tabla { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.pv-tabla th, .pv-tabla td { padding: 8px 10px; border-bottom: 1px solid var(--linea); text-align: left; }
.pv-tabla th { white-space: nowrap; width: 1%; }
.pv-tabla td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pv-tabla tr.elegido { background: #fff8d6; }
.pv-tabla tr.elegido th { box-shadow: inset 3px 0 0 var(--amarillo); }
.pv-resultado { display: flex; justify-content: space-between; align-items: baseline; gap: 8px 14px; flex-wrap: wrap; margin-top: 12px;
                background: var(--carbon); color: #fff; border-radius: 6px; padding: 12px 14px; }
.pv-resultado[hidden] { display: none; }
.pv-monto { font-family: var(--fuente-titulos); font-weight: 400; font-size: 28px; line-height: 1; color: var(--amarillo); }
.pv-nota { margin: 10px 0 12px; }
@media (max-width: 700px) {
  .sentido-opciones, .pv-campos { grid-template-columns: 1fr; }
  .pv-tabla td.chica { display: none; }
}

/* ---- Mi primera importación (primera.py, templates/primera/) */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* Término del glosario: subrayado punteado; al pasar el mouse o tocarlo, la explicación. */
.termino { position: relative; border-bottom: 1px dotted currentColor; cursor: help; outline: none; }
.termino-def { display: none; position: absolute; z-index: 30; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%); width: 260px;
               max-width: 80vw; padding: 10px 12px; border-radius: var(--radio); background: var(--carbon); color: #f2f2f2;
               font-size: 12.5px; font-weight: 500; line-height: 1.45; text-align: left; box-shadow: 0 8px 24px rgba(0, 0, 0, .2); }
.termino-def strong { color: var(--amarillo); }
.termino:hover .termino-def, .termino:focus .termino-def { display: block; }
.camino-pasos.cinco { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 600px) {
  .camino-pasos.cinco li { font-size: 10.5px; }
  .camino-pasos.cinco .camino-nombre { display: none; }
  .camino-pasos.cinco li.actual .camino-nombre { display: block; position: absolute; top: 36px; white-space: nowrap; }
  .camino-pasos.cinco { margin-bottom: 30px; }
  .camino-pasos.cinco li:first-child.actual .camino-nombre { left: 0; }
  .camino-pasos.cinco li:last-child.actual .camino-nombre { right: 0; }
}
/* menú: Consultas y Herramientas a la derecha */
.menu-derecha { display: flex; align-items: stretch; margin-left: auto; }
@media (max-width: 760px) { .menu-derecha { flex-direction: column; margin-left: 0; border-top: 1px solid #333338; } }
/* tarjeta del perfil importador en la carátula: anillo de avance, estado de cada punto y contacto */
.card.pri-pc { max-width: none; margin: 0 0 20px; padding: 22px 24px; }
.pri-pc-cabeza { display: flex; align-items: center; gap: 18px; }
.pri-pc-anillo { flex: none; width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center;
                 background: conic-gradient(var(--green) calc(var(--p) * 1%), var(--superficie) 0); }
.pri-pc-anillo > span { width: 50px; height: 50px; border-radius: 50%; background: var(--card); display: flex; align-items: baseline;
                        justify-content: center; padding-top: 16px; font-weight: 800; font-size: 18px; line-height: 1; }
.pri-pc-anillo small { font-size: 11px; color: var(--muted); font-weight: 600; }
.pri-pc-titulo { flex: 1; min-width: 0; }
.pri-pc-titulo h2 { margin: 0 0 2px; }
.pri-pc-titulo p { margin: 0; color: var(--muted); font-size: 13.5px; }
.pri-pc-ver { flex: none; }
.pri-pc-items { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; }
.pri-pc-items li { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: var(--radio); background: var(--superficie);
                   font-weight: 700; font-size: 13.5px; line-height: 1.3; }
.pri-pc-icono { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800;
                background: var(--border); color: var(--muted); }
.pri-pc-items .s-ok { background: var(--green-bg); } .pri-pc-items .s-ok .pri-pc-icono { background: var(--green); color: #fff; }
.pri-pc-items .s-ojo { background: var(--orange-bg); } .pri-pc-items .s-ojo .pri-pc-icono { background: #e0a100; color: #fff; }
.pri-pc-items .s-falta { background: var(--red-bg); } .pri-pc-items .s-falta .pri-pc-icono { background: var(--red); color: #fff; }
.pri-pc-pie { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; margin-top: 16px;
              padding-top: 16px; border-top: 1px solid var(--linea); }
.pri-pc-pie .muted { font-size: 13.5px; }
@media (max-width: 600px) {
  .card.pri-pc { padding: 18px 16px; }
  .pri-pc-cabeza { flex-wrap: wrap; }
  .pri-pc-ver { width: 100%; justify-content: center; text-align: center; }
  .pri-pc-items { grid-template-columns: 1fr 1fr; }
}
.pri-herramientas .seccion-tarjeta { min-height: 0; }
.pri-herramientas .seccion-tarjeta.bloqueada { opacity: .7; }
.pri-ayuda .seccion-tarjeta { min-height: 0; }
.pri-ayuda-texto { color: var(--muted); font-size: 13px; }
.card.pri-pendientes, .card.pri-invitacion { max-width: none; margin: 0 0 20px; }
.pri-pendientes h2 { margin-top: 0; }
.pri-invitacion { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-left: 4px solid var(--amarillo); }
.pri-invitacion p { margin: 0; }
.pri-mas-tarde { margin-top: 10px; }

/* semáforo del perfil importador */
.pri-semaforo { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pri-semaforo li { display: flex; gap: 10px; align-items: flex-start; }
.pri-semaforo li div { display: flex; flex-direction: column; }
.pri-semaforo li span:not(.pri-luz) { color: var(--muted); font-size: 13px; }
.pri-luz { flex: none; width: 12px; height: 12px; margin-top: 4px; border-radius: 50%; background: var(--border); }
.s-ok .pri-luz { background: var(--green); }
.s-ojo .pri-luz { background: #e0a100; }
.s-falta .pri-luz { background: var(--red); }
.pri-perfil, .pri-costos { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.pri-perfil .card, .pri-costos .card { max-width: none; margin: 0; }
.pri-resultado, .pri-resultado-costos, .pri-bloqueo { position: sticky; top: 16px; }
.pri-resultado h2, .pri-resultado-costos h2, .pri-bloqueo h2, .pri-datos h2 { margin-top: 0; }
.pri-pregunta, fieldset.pri-campo { border: 0; padding: 0; margin: 0 0 20px; min-width: 0; }
.pri-pregunta legend, .pri-campo legend, .pri-campo > label, .pri-ncm-cabeza > label { font-weight: 700; font-size: 14.5px; padding: 0; margin-bottom: 6px; display: block; }
.pri-pregunta p { margin: 0 0 8px; }
.pri-campo { margin-bottom: 20px; }
.pri-campo .chica { margin-top: 4px; }
.pri-opciones { display: flex; flex-wrap: wrap; gap: 6px 22px; }
.pri-opcion { display: inline-flex; align-items: center; gap: 7px; margin: 0; cursor: pointer; font-weight: 500; font-size: 13.5px; }
.pri-opcion input { margin: 0; }
.pri-opcion:has(input:checked) { font-weight: 700; }
.pri-opciones-dos { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.pri-preguntas .pri-pregunta { padding-bottom: 16px; border-bottom: 1px solid var(--linea); }
/* el perfil cargado, en modo lectura (se edita con el lápiz) */
.pri-ver-cabeza { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.pri-ver-cabeza h2 { margin: 0; }
.pri-lapiz { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; color: var(--text); }
.pri-lapiz:hover { background: var(--superficie); }
.pri-lapiz svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; stroke-linecap: round; }
.pri-respuestas { margin: 0 0 14px; }
.pri-respuestas > div { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--linea); }
.pri-respuestas dt { color: var(--muted); font-weight: 500; font-size: 13px; }
.pri-respuestas dd { margin: 0; font-weight: 700; }
@media (max-width: 600px) { .pri-respuestas > div { grid-template-columns: 1fr; gap: 2px; } }
.pri-salida { margin-top: 18px; padding: 14px 16px; border-radius: var(--radio); background: #fffbea; border: 1px solid #f3e3a0; }
.pri-salida p { margin: 0 0 10px; }
.pri-listo { margin: 16px 0 0; font-weight: 600; color: var(--green); }

/* Mis costos */
.pri-costos .calc-grilla { margin-top: 10px; }
.pri-die { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pri-die input[type=number] { width: 90px; }
.pri-die input:disabled { opacity: .5; }
.pri-aviso-chico { margin: 10px 0 0; font-size: 13px; padding: 10px 12px; border-radius: var(--radio); background: var(--superficie); }
.pri-indice { display: flex; flex-direction: column; gap: 2px; padding: 16px 18px; border-radius: var(--radio); background: var(--carbon); color: #fff; margin-bottom: 14px; }
.pri-indice-txt { font-size: 13px; color: #d2d2d7; }
.pri-indice-num { font-family: var(--fuente-titulos); font-size: 46px; letter-spacing: .04em; line-height: 1.05; color: var(--amarillo); }
.pri-indice-pct { font-size: 13px; color: #d2d2d7; }
.pri-indice-borroso .pri-indice-num { filter: blur(5px); user-select: none; }
.pri-dos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 14px; }
.pri-dos > div { display: flex; flex-direction: column; padding: 12px 14px; border-radius: var(--radio); background: var(--superficie); }
.pri-dos span { font-size: 12.5px; color: var(--muted); }
.pri-dos strong { font-size: 22px; line-height: 1.25; }
.pri-dos small { font-size: 12px; color: var(--muted); }
.pri-ncm-cabeza { display: flex; justify-content: space-between; align-items: baseline; gap: 4px 12px; flex-wrap: wrap; }
.pri-ncm-cabeza a { font-size: 13px; white-space: nowrap; }
.pri-ncm { margin: 8px 0 0; padding: 8px 12px; border-radius: var(--radio); font-size: 13px; background: var(--superficie); }
.pri-ncm.ok { background: var(--green-bg); }
.pri-ncm.ojo { background: var(--orange-bg); }
.pri-barra { display: flex; height: 14px; border-radius: 7px; overflow: hidden; gap: 2px; margin-bottom: 12px; background: var(--superficie); }
.pri-partes { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 10px; }
.pri-partes li { display: grid; grid-template-columns: 12px 1fr auto; gap: 10px; align-items: start; }
.pri-partes li div { display: flex; flex-direction: column; }
.pri-partes small { color: var(--muted); font-size: 12px; }
.pri-partes .num { text-align: right; font-weight: 700; white-space: nowrap; display: flex; flex-direction: column; }
.pri-punto { width: 12px; height: 12px; border-radius: 3px; margin-top: 4px; }
.pri-real { margin: 0 0 14px; padding: 10px 12px; border-radius: var(--radio); background: var(--green-bg); font-size: 13px; }
.pri-flete { padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--radio); margin-bottom: 12px; }
.pri-flete-cabeza { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-weight: 700; margin-bottom: 8px; }
.pri-chip { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: var(--superficie); color: var(--muted); }
.pri-chip.ref { background: var(--green-bg); color: var(--green); }
.pri-chip.propio { background: #e8f0fb; color: #2563a8; }
.pri-chip.falta { background: var(--orange-bg); color: var(--orange); }
.pri-cargable { margin: 0 0 12px; background: var(--orange-bg); }
.pri-vias { padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--radio); margin-bottom: 12px; }
.pri-vias-reco { margin: 0 0 10px; font-size: 13.5px; }
.pri-vias-lista { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 6px; }
.pri-vias-lista li { display: grid; grid-template-columns: 1fr auto 104px; gap: 10px; align-items: center; padding: 8px 10px;
  border-radius: var(--radio); background: var(--superficie); }
.pri-vias-lista li > div:first-child { display: flex; flex-direction: column; }
.pri-vias-lista small { font-size: 12px; color: var(--muted); font-weight: 400; }
.pri-vias-lista .num { text-align: right; font-weight: 700; display: flex; flex-direction: column; }
.pri-vias-lista li.mejor { background: var(--green-bg); }
.pri-vias-lista li.actual { box-shadow: inset 0 0 0 2px var(--carbon); }
.pri-vias-lista li.no { opacity: .7; }
.pri-vias-accion { text-align: right; font-size: 13px; }
.pri-vias-contacto { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 10px; padding: 10px 12px;
  border-radius: var(--radio); background: #fffbea; border: 1px solid #f3e3a0; }
.pri-mono { margin: 12px 0 0; }
.pri-pendientes { margin: 0 0 12px; padding-left: 18px; font-size: 13.5px; }
.pri-pendientes li { margin: 4px 0; }
.pri-opcion.deshabilitada { opacity: .45; cursor: not-allowed; }
#c-courier-no { margin: 8px 0 0; }
.camino-cabeza-der { display: inline-flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.pri-reiniciar { display: inline; margin: 0; }
.pri-reiniciar-btn { background: none; border: 0; padding: 0; font: inherit; font-size: 12px; font-weight: 600; color: var(--muted); cursor: pointer;
                     border-left: 1px solid var(--border); padding-left: 14px; }
.pri-reiniciar-btn:hover { color: var(--text); }
.pri-costos .pri-flete { margin-bottom: 18px; }
.pri-flete-cabeza label { font-weight: 700; font-size: 14.5px; }
.pri-flete-falta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 10px; padding: 10px 12px;
  border-radius: var(--radio); background: #fffbea; border: 1px solid #f3e3a0; }
.pri-vias-reglas summary { cursor: pointer; font-weight: 600; font-size: 13px; }
.pri-vias-reglas ul { margin: 8px 0 0; padding-left: 18px; color: var(--muted); }
.pri-vias-reglas li { margin: 4px 0; }
@media (max-width: 600px) {
  .pri-vias-lista li { grid-template-columns: 1fr auto; }
  .pri-vias-accion { grid-column: 1 / -1; text-align: left; }
}
.pri-detalle { margin-bottom: 8px; }
.pri-detalle summary { cursor: pointer; font-weight: 600; font-size: 13px; }
.pri-o { display: flex; align-items: center; gap: 10px; margin: 18px 0 6px; color: var(--muted); font-size: 12px; }
.pri-o::before, .pri-o::after { content: ""; flex: 1; height: 1px; background: var(--border); }

/* Glosario */
.card.pri-glosario { max-width: 860px; }
.pri-glosario input[type=search] { width: 100%; margin-bottom: 14px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--radio); font: inherit; font-size: 14px; background: var(--card); }
.pri-glosario dl { margin: 0; display: grid; gap: 0; }
.pri-termino { padding: 12px 0; border-bottom: 1px solid var(--linea); }
.pri-termino dt { font-weight: 800; font-size: 15px; margin-bottom: 3px; }
.pri-termino dd { margin: 0; }
.pri-practica { display: block; margin-top: 4px; font-size: 13px; color: var(--muted); }

/* Consultas */
.card.pri-chat { max-width: 760px; }
.pri-mensajes { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.pri-mensajes li { display: flex; flex-direction: column; max-width: 82%; }
.pri-mensajes li.mio { align-self: flex-end; align-items: flex-end; }
.pri-burbuja { padding: 10px 14px; border-radius: 14px; background: var(--superficie); white-space: pre-wrap; overflow-wrap: anywhere; }
.pri-mensajes li.mio .pri-burbuja { background: #fff4c2; }
.pri-quien { font-size: 11.5px; color: var(--muted); margin-top: 3px; }
.pri-vacio { margin-top: 0; }
.pri-escribir { display: flex; gap: 10px; align-items: flex-end; }
.pri-escribir textarea { flex: 1; min-width: 0; }
.card.pri-hilo { max-width: 860px; }
.pri-hilo > summary { cursor: pointer; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pri-hilo > summary .chica { margin: 0; }
.pri-hilo-perfil { margin: 12px 0; }
.pri-hilo-perfil summary { cursor: pointer; }
.pri-hilo-perfil .pri-semaforo { margin-top: 8px; }
@media (max-width: 860px) {
  .pri-perfil, .pri-costos { grid-template-columns: 1fr; }
  .pri-resultado, .pri-resultado-costos, .pri-bloqueo { position: static; }
}
@media (max-width: 600px) {
  .pri-escribir { flex-direction: column; align-items: stretch; }
  .pri-mensajes li { max-width: 92%; }
  .pri-indice-num { font-size: 40px; }
}

/* ---- Medidas de los bultos (static/medidas.js): opcional, calcula el volumen */
.calc-grilla > .sinc-ancho, .calc-grilla > .medidas { grid-column: 1 / -1; }
.medidas { margin-top: 10px; }
.medidas-caja > summary { cursor: pointer; font-size: 13px; font-weight: 600; }
.medidas-caja[open] > summary { margin-bottom: 8px; }
.medidas-filas { display: grid; gap: 8px; }
.medidas-fila { display: grid; grid-template-columns: 64px minmax(96px, 1.2fr) repeat(3, minmax(0, 1fr)) 28px; gap: 8px; align-items: end; }
.medidas-fila label { display: flex; flex-direction: column; gap: 3px; margin: 0; font-size: 12px; font-weight: 600; color: var(--muted); }
.medidas-fila input, .medidas-fila select { width: 100%; min-width: 0; }
.medidas-quitar { height: 36px; border: 0; background: none; color: var(--muted); cursor: pointer; font-size: 13px; border-radius: 6px; }
.medidas-quitar:hover { background: var(--superficie); color: var(--text); }
.medidas-pie { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 8px; }
.medidas-total { font-weight: 700; }
@media (max-width: 600px) { .medidas-fila { grid-template-columns: repeat(3, minmax(0, 1fr)) 28px; } .medidas-fila .medidas-tipo { grid-column: span 3; } }

/* Mi cuenta del proveedor de servicios logísticos: los servicios que da, en grilla */
.opciones-servicio { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 6px 14px; margin: 6px 0 16px; }

/* Mercado de la red: mis publicaciones */
.pub-llave { border-left: 4px solid var(--amarillo); }
.pub-llave.ok { border-left-color: var(--green); }
.pub-nueva > summary { list-style: none; cursor: pointer; }
.pub-nueva > summary::-webkit-details-marker { display: none; }
.pub-nueva[open] > summary .btn { background: var(--superficie); }
.pub-clase { display: flex; gap: 18px; margin-bottom: 12px; font-weight: 600; }
.pub-clase label { display: flex; gap: 6px; align-items: center; cursor: pointer; }
.pub-acciones { white-space: nowrap; text-align: right; }
.pub-acciones .desplegable { display: inline-block; margin-left: 8px; }
.pub-editar { text-align: left; white-space: normal; min-width: min(560px, 80vw); margin-top: 8px; }
.pub-mas { display: flex; gap: 14px; margin-top: 8px; }
.pub-acciones .en-linea { display: inline-flex; vertical-align: middle; }

/* Mercado de la red: la vidriera */
.creditos-chip { align-self: center; padding: 6px 14px; border-radius: 999px; background: var(--amarillo); font-weight: 700; font-size: 13px; white-space: nowrap; }
.filtros-mercado { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.filtros-mercado input { flex: 1 1 240px; }
.filtros-mercado select { flex: 0 1 220px; }
.contacto-visto { font-size: 13px; line-height: 1.5; }
.oportunidad { margin-bottom: 12px; }
.oportunidad.en-revision { border-left: 4px solid var(--amarillo); }
.oportunidad h3 { margin: 8px 0 6px; font-size: 16px; }
.oportunidad-cabeza { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.oportunidad-fecha { margin-left: auto; }
.oportunidad-detalle { margin-top: 8px; }
.oportunidad-texto { white-space: pre-line; margin: 6px 0; }
.oportunidad-pie { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.chip-origen { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; background: var(--superficie, #f1efe9); }
.chip-origen.o-primera { background: #e8f1ff; color: #1d4ed8; }
.chip-origen.o-empresa { background: #fff5c7; color: #7a5b00; }
.chip-origen.o-empresa_ops { background: var(--green-bg); color: var(--green); }

/* Pedir cotización: a quién se lo pide la empresa (NETWISE y/o el Mercado de agentes) */
.cot-destinos { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; }
.cot-destino { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--border, #e3e1db); border-radius: 10px; cursor: pointer; }
.cot-destino:has(input:checked) { border-color: var(--amarillo); background: #fffbea; }
.cot-destino input { margin-top: 3px; }
.cot-destino small { display: block; color: var(--muted); font-weight: 400; margin-top: 2px; }

/* ================================================================ Mercado de la red: estilo terminal
   Más corporativo que el resto de la app: grilla, esquinas rectas, rótulos en mayúscula y números monoespaciados. */
.terminal { --t-linea: #d9d7d0; --t-fondo: #fbfbf9; --t-cab: #f0efea; --t-osc: #18181b; --t-mono: "Consolas", "SFMono-Regular", "Menlo", monospace; }
.terminal .btn, .terminal input, .terminal select, .terminal textarea { border-radius: 2px; }
.t-mono, .terminal .t-monto, .terminal .t-num { font-family: var(--t-mono); font-variant-numeric: tabular-nums; }
.terminal td.t-mono { white-space: nowrap; }
/* Oportunidades: qué servicio necesita y su target; NETWISE las revisa antes de publicar; el agente elige si avisa su interés */
.terminal .t-necesita { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 6px; font-size: 12px; color: var(--muted); }
.terminal .t-necesita strong { color: var(--text); }
.terminal .t-revisar { display: grid; gap: 6px; margin-top: 8px; font-size: 12px; }
.terminal .t-revisar-alc { display: flex; flex-wrap: wrap; gap: 4px 10px; }
.terminal .t-revisar-alc label, .terminal .t-revisar-target { display: inline-flex; align-items: center; gap: 4px; font-weight: 500; }
.terminal .t-revisar-target input { width: 90px; padding: 3px 6px; font-size: 12px; }
.terminal .t-revisar-preg { font-weight: 700; margin-top: 4px; }
.terminal .t-revisar .t-boton { justify-self: start; text-align: left; }
.terminal .t-interes { display: grid; gap: 6px; margin-top: 10px; padding: 10px; border: 1px dashed var(--t-linea); background: #fffdf2; font-size: 12px; }
.terminal .t-interes small { color: var(--muted); }
   /* fechas: no partir «27/10/2026» */
.t-etq { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }

/* encabezado oscuro */
.t-cabeza { display: flex; justify-content: space-between; align-items: stretch; gap: 20px; background: var(--t-osc); color: #fff;
            padding: 20px 24px; border: 1px solid var(--t-osc); border-bottom: 3px solid var(--amarillo); margin-top: 4px; }
.t-cabeza h1 { color: #fff; margin: 2px 0 4px; font-size: 34px; letter-spacing: .06em; }
.t-cabeza p { margin: 0; color: #b9b9bf; font-size: 13px; max-width: 760px; }
.t-eyebrow { font-size: 10.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--amarillo); }
.t-creditos { display: flex; flex-direction: column; justify-content: center; align-items: flex-end; min-width: 120px; padding: 6px 0 6px 20px;
              border-left: 1px solid #3a3a40; }
.t-creditos .t-etq { color: #9a9aa1; }
.t-creditos .t-num { font-size: 32px; font-weight: 700; color: var(--amarillo); line-height: 1.1; }

/* indicadores: una fila de recuadros */
.t-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); border: 1px solid var(--t-linea); border-top: 0; background: #fff; }
.t-kpi { padding: 12px 16px; border-right: 1px solid var(--t-linea); }
.t-kpi:last-child { border-right: 0; }
.t-kpi .t-num { display: block; font-size: 24px; font-weight: 700; margin-top: 2px; }

/* navegación y pestañas: segmentos rectos */
.t-nav { display: flex; margin: 18px 0 14px; border: 1px solid var(--t-osc); width: max-content; max-width: 100%; }
.t-nav a { padding: 8px 18px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--t-osc);
           text-decoration: none; border-right: 1px solid var(--t-osc); }
.t-nav a:last-child { border-right: 0; }
.t-nav a.activo { background: var(--t-osc); color: var(--amarillo); }
.t-nav a:not(.activo):hover { background: var(--t-cab); }
.t-tabs { display: flex; border-bottom: 2px solid var(--t-osc); margin: 6px 0 0; }
.t-tabs button { background: none; border: 1px solid transparent; border-bottom: 0; padding: 9px 18px; font: inherit; font-size: 12px; font-weight: 700;
                 letter-spacing: .08em; text-transform: uppercase; color: var(--muted); cursor: pointer; border-radius: 0; }
.t-tabs button span { font-family: var(--t-mono); margin-left: 6px; color: inherit; opacity: .8; }
.t-tabs button em { font-style: normal; margin-left: 8px; padding: 1px 6px; background: var(--amarillo); color: var(--t-osc); font-size: 10.5px; }
.t-tabs button.activa { background: var(--t-osc); color: #fff; border-color: var(--t-osc); }

/* avisos y paneles */
.t-aviso { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 14px; margin: 0 0 14px; background: #fffbea;
           border: 1px solid #ecd97a; border-left: 4px solid var(--amarillo); font-size: 13px; }
.t-aviso.ok { background: var(--green-bg); border-color: #b9e0cf; border-left-color: var(--green); }
.t-panel { border: 1px solid var(--t-linea); background: #fff; margin: 0 0 16px; }
.t-panel-tit { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; background: var(--t-cab); cursor: pointer;
               font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; list-style: none; }
.t-panel-tit::-webkit-details-marker { display: none; }
.t-mas { font-family: var(--t-mono); font-size: 16px; }
.t-panel[open] .t-mas { transform: rotate(45deg); }
.t-panel[open] .t-panel-tit { border-bottom: 1px solid var(--t-linea); }
.t-panel-cuerpo { padding: 16px; }
.t-campos { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-bottom: 12px; }
.t-campos[hidden], .t-seguro [hidden] { display: none; }
.t-seguro { display: flex; flex-direction: column; gap: 6px; justify-content: flex-end; }
.t-segmento { display: inline-flex; border: 1px solid var(--t-osc); margin-bottom: 14px; }
.t-segmento label { margin: 0; cursor: pointer; }
.t-segmento input { position: absolute; opacity: 0; pointer-events: none; }
.t-segmento span { display: block; padding: 7px 18px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.t-segmento label + label span { border-left: 1px solid var(--t-osc); }
.t-segmento input:checked + span { background: var(--t-osc); color: var(--amarillo); }
.t-segmento input:focus-visible + span { outline: 2px solid var(--amarillo); }

/* filtros */
.t-filtros { display: flex; gap: 0; flex-wrap: wrap; margin: 12px 0 0; border: 1px solid var(--t-linea); background: #fff; }
.t-filtros input[type=search], .t-filtros select { border: 0; border-right: 1px solid var(--t-linea); border-radius: 0; padding: 10px 12px; }
.t-filtros input[type=search] { flex: 1 1 260px; }
.t-filtros select { flex: 0 1 230px; }
.t-check { display: flex; align-items: center; gap: 6px; padding: 0 14px; font-size: 12.5px; font-weight: 600; margin: 0; white-space: nowrap; }

/* la grilla */
.terminal .tabla-scroll { border: 1px solid var(--t-linea); border-radius: 0; box-shadow: none; margin-top: 12px; background: #fff; }
.t-filtros + .tabla-scroll { border-top: 0; margin-top: 0; }
.t-tabla th { background: var(--t-cab); color: #4a4a50; font-size: 10.5px; letter-spacing: .1em; padding: 8px 12px; border-right: 1px solid var(--t-linea);
              border-bottom: 1px solid var(--t-linea); white-space: nowrap; }
.t-tabla td { padding: 10px 12px; border-right: 1px solid var(--t-linea); border-bottom: 1px solid var(--t-linea); font-size: 13px; }
.t-tabla th:last-child, .t-tabla td:last-child { border-right: 0; }
.t-tabla tbody tr:nth-child(even) td { background: var(--t-fondo); }
.t-tabla tbody tr:hover td { background: #fffbea; }
.t-tabla tr.t-apagada td { color: var(--suave); }
.t-tabla tr.t-revision td { background: #fffbea; }
.t-tabla tr.t-revision td:first-child { box-shadow: inset 3px 0 0 var(--amarillo); }
.t-sub { display: block; font-size: 11.5px; color: var(--muted); font-weight: 500; }
.t-flecha { color: var(--suave); }
.t-tabla-tit { margin: 22px 0 0; padding: 8px 12px; background: var(--t-osc); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .1em;
               text-transform: uppercase; }
.t-tabla-tit span { font-family: var(--t-mono); color: var(--amarillo); margin-left: 6px; }
.t-tabla-tit + .tabla-scroll { margin-top: 0; }
.t-nota { font-size: 11.5px; color: var(--muted); margin: 8px 0 0; }
.t-vacio { border: 1px dashed var(--t-linea); padding: 28px; text-align: center; color: var(--muted); background: #fff; margin-top: 12px; }

/* precio con desglose */
.t-precio { display: inline-flex; flex-direction: column; align-items: flex-end; gap: 1px; }
.t-monto { font-size: 15px; font-weight: 700; }
.t-monto.chico { font-size: 12.5px; font-weight: 600; }
.t-precio .t-sub { font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em; }
.t-linea { display: flex; gap: 10px; justify-content: space-between; min-width: 150px; font-size: 11.5px; color: var(--muted);
           border-top: 1px dotted var(--t-linea); padding-top: 2px; }
.t-candado { font-family: var(--t-mono); color: var(--suave); letter-spacing: .1em; }

/* chips, estados y botones rectos */
.t-chip { display: inline-block; margin: 0 4px 3px 0; padding: 1px 6px; border: 1px solid var(--t-linea); background: #fff; font-size: 10.5px;
          font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #4a4a50; }
.t-chip.verde { border-color: #b9e0cf; background: var(--green-bg); color: var(--green); }
.t-chip.amarillo { border-color: #ecd97a; background: #fff5c7; color: #7a5b00; }
.t-chip.o-primera { border-color: #bcd3fb; background: #e8f1ff; color: #1d4ed8; }
.t-chip.o-empresa { border-color: #ecd97a; background: #fff5c7; color: #7a5b00; }
.t-chip.o-empresa_ops { border-color: #b9e0cf; background: var(--green-bg); color: var(--green); }
.t-chip.o-agente, .t-chip.o-netwise { background: var(--t-cab); }
.t-estado { display: inline-block; padding: 1px 7px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
            border: 1px solid var(--t-linea); background: var(--t-cab); }
.t-estado.verde { border-color: #b9e0cf; background: var(--green-bg); color: var(--green); }
.t-estado.amarillo { border-color: #ecd97a; background: #fff5c7; color: #7a5b00; }
.t-estado.rojo { border-color: #f1caca; background: var(--red-bg); color: var(--red); }
.t-boton { display: inline-flex; align-items: center; gap: 8px; padding: 5px 10px; border: 1px solid var(--t-osc); background: var(--t-osc); color: #fff;
           font: inherit; font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; cursor: pointer;
           text-decoration: none; border-radius: 0; white-space: nowrap; }
.t-boton span { font-family: var(--t-mono); color: var(--amarillo); }
.t-boton:hover { background: #2c2c31; }
.t-boton.secundario { background: #fff; color: var(--t-osc); }
.t-boton.apagado { background: var(--t-cab); color: var(--suave); border-color: var(--t-linea); cursor: not-allowed; }
.t-boton.apagado span { color: var(--suave); }
.t-acciones { display: flex; gap: 6px; margin-top: 6px; }
.t-contacto { font-size: 12.5px; line-height: 1.5; }
.t-contacto .t-sub { display: inline; margin-left: 6px; }

/* el pedido completo de una oportunidad */
.t-detalle summary { font-size: 11.5px; color: var(--muted); cursor: pointer; margin-top: 4px; }
.t-ficha { margin-top: 6px; border: 1px solid var(--t-linea); width: auto; min-width: min(420px, 100%); }
.t-ficha th, .t-ficha td { padding: 4px 8px; border-bottom: 1px solid var(--t-linea); font-size: 12px; text-transform: none; letter-spacing: 0; }
.t-ficha th { background: var(--t-cab); color: var(--muted); font-weight: 600; width: 40%; }

@media (max-width: 700px) {
  .t-cabeza { flex-direction: column; padding: 16px; }
  .t-creditos { flex-direction: row; align-items: baseline; gap: 10px; border-left: 0; border-top: 1px solid #3a3a40; padding: 10px 0 0; }
  .t-kpis { grid-template-columns: 1fr 1fr; }
  .t-kpi:nth-child(2n) { border-right: 0; }
  .t-kpi { border-bottom: 1px solid var(--t-linea); }
  .t-tabs { overflow-x: auto; }
  .t-tabs button { white-space: nowrap; padding: 9px 12px; }
  .t-filtros select, .t-filtros input[type=search] { flex: 1 1 100%; border-right: 0; border-bottom: 1px solid var(--t-linea); }
  .t-check { padding: 10px 12px; }
  .t-tabla td { border-right: 0; }
  .t-precio { align-items: flex-end; }
}
.t-persona { display: flex; flex-wrap: wrap; gap: 2px 10px; }
.t-persona span { font-weight: 600; }

/* Proyecto · Red NETWISE: solicitar a la red, agentes interesados, responder cotizaciones de Mercado */
.red-panel .red-estado { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 0; }
.red-interesados { list-style: none; margin: 0; padding: 0; }
.red-interesados li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid var(--linea); }
.red-panel summary.btn { display: inline-flex; list-style: none; }
.red-panel summary.btn::-webkit-details-marker { display: none; }
.red-responder { margin-top: 4px; }
.red-responder input[type=text] { margin: 6px 0; }
.red-resumen { border: 1px solid var(--border); border-radius: 8px; padding: 12px 14px; margin-bottom: 12px; background: var(--hover); }
.red-resumen .titulo-grupo { display: block; margin-bottom: 4px; }
.red-datos { display: grid; grid-template-columns: max-content 1fr; gap: 2px 14px; margin: 8px 0 0; font-size: 13px; }
.red-datos dt { color: var(--muted); }
.red-datos dd { margin: 0; }
.red-solicitar .btn { margin-right: 8px; }

/* Mi primera importación · proyecto: las tres maneras de cotizar */
/* Mi primera importación: confirmar el proyecto (paso 1), las dos maneras de armar el presupuesto (paso 2), el aviso
   de que los costos son una simulación y el lápiz para cargar un valor propio. */
.pri-confirmar p { margin: 0 0 12px; }
.pri-confirmar-lista { list-style: none; margin: 0 0 16px; padding: 0; border-top: 1px solid var(--linea); }
.pri-confirmar-lista li { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px solid var(--linea); font-size: 13px; }
.pri-confirmar-lista li span { color: var(--muted); }
.pri-confirmar-lista li strong { text-align: right; overflow-wrap: anywhere; }
.pri-confirmar .btn { width: 100%; }
.pri-proyecto-linea { margin: 0 0 12px; }
.pri-presupuesto { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pri-presupuesto section { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 16px; display: flex; flex-direction: column; }
.pri-presupuesto h4 { margin: 0 0 6px; font-size: 14.5px; }
.pri-presupuesto p { margin: 0 0 14px; font-size: 13px; color: var(--muted); flex: 1; }
.pri-presupuesto .btn { align-self: flex-start; }
@media (max-width: 700px) { .pri-presupuesto { grid-template-columns: 1fr; } }
/* Mis costos: los números en orden, los índices y a quién se le paga cada cosa */
.pri-numeros { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; margin-bottom: 14px; }
.pri-num { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 11px 16px; border-bottom: 1px solid var(--linea); }
.pri-num > span { font-size: 14px; font-weight: 600; }
.pri-num small { display: block; font-size: 11.5px; font-weight: 400; color: var(--muted); }
.pri-num strong { font-size: 16px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pri-num.recupero strong { color: var(--green); }
.pri-num.total { background: var(--carbon); color: #fff; border-bottom: 0; padding: 16px; }
.pri-num.total small { color: #b9b9c0; }
.pri-num.total strong { font-family: var(--fuente-titulos); font-weight: 400; font-size: 34px; color: var(--amarillo); letter-spacing: .01em; }
.pri-num-nota { margin: 0; padding: 9px 16px; background: #fffbea; font-size: 12.5px; }
.pri-indices { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 8px; margin-bottom: 18px; }
.pri-indice-caja { background: var(--superficie); border-radius: 8px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.pri-indice-caja span { font-size: 11.5px; color: var(--muted); line-height: 1.3; }
.pri-indice-caja strong { font-size: 22px; font-variant-numeric: tabular-nums; }
.pri-indice-caja small { font-size: 11px; color: var(--muted); }
.pri-indice-caja.fuerte { background: var(--amarillo); }
.pri-indice-caja.fuerte span, .pri-indice-caja.fuerte small { color: var(--text); }
.pri-quien-tit { font-size: 13px; margin: 0 0 8px; }
.pri-quien { display: inline-block; align-self: flex-start; margin: 3px 0 2px; font-size: 10.5px; font-weight: 700; padding: 1px 7px; border-radius: 999px;
             background: var(--superficie); color: var(--text); vertical-align: 1px; }
.pri-simulado { border-left: 3px solid var(--amarillo); background: #fffbea; padding: 10px 14px; margin: 0 0 16px; font-size: 12.5px; border-radius: 0 6px 6px 0; }
.pri-simulado p { margin: 4px 0 0; color: #4a4a50; line-height: 1.5; }
.sinc-tabla tr.propio td:first-child::after { content: "tu valor"; margin-left: 6px; font-size: 10px; font-weight: 700; padding: 1px 6px;
  border-radius: 999px; background: var(--carbon); color: var(--amarillo); vertical-align: 1px; }
.sinc-tabla tr.propio .sinc-det { display: none; }
.c-lapiz, .c-volver { border: 0; background: none; cursor: pointer; color: var(--suave); font-size: 13px; padding: 0 2px; }
.c-lapiz:hover, .c-volver:hover { color: var(--text); }
.c-editar { display: inline-flex; align-items: center; gap: 4px; }
.c-editar input { width: 96px; padding: 3px 6px; font-size: 12.5px; text-align: right; }
.c-editar span { font-size: 11px; color: var(--muted); }
.pri-cotizar { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.pri-via { position: relative; display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 10px; padding: 16px; background: #fff; }
.pri-via.destacada { border-color: var(--amarillo); box-shadow: inset 0 3px 0 var(--amarillo); }
.pri-via h3 { margin: 6px 0 6px; font-size: 15px; }
.pri-via p { margin: 0 0 12px; font-size: 13px; color: var(--muted); flex: 1; }
.pri-via-n { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%;
                background: var(--carbon); color: var(--amarillo); font-size: 12px; font-weight: 700; }
.pri-via-acciones { display: flex; gap: 8px; flex-wrap: wrap; margin: 0; }
.pri-via .red-panel .grid { grid-template-columns: 1fr; gap: 8px; }
.pri-via .red-panel .btn { margin-top: 8px; }
.pri-solicitud { margin: -4px 0 12px; }
@media (max-width: 900px) { .pri-cotizar { grid-template-columns: 1fr; } }
.pri-via { text-align: left; }
.pri-via .red-panel label { font-size: 12px; }
.pri-via .red-panel input { padding: 6px 9px; font-size: 13px; }
.pri-via .red-panel .muted.chica { display: block; margin-top: 4px; }
.pri-aviso-red { border-left: 4px solid var(--amarillo); background: #fffbea; padding: 10px 14px; margin: 0 0 14px; border-radius: 0 8px 8px 0; }
.pri-aviso-red p { margin: 0 0 6px; }
.pri-aviso-red p:last-child { margin: 0; }

/* Borrar desde el listado (proyectos y operaciones): una ✕ discreta al final de la fila */
th.fila-borrar, td.fila-borrar { width: 34px; padding-left: 0; padding-right: 10px; text-align: right; }
td.fila-borrar form { margin: 0; }
td.fila-borrar button, .cot-borrar button { width: 26px; height: 26px; border: 1px solid transparent; border-radius: 6px; background: none;
  color: var(--suave); font-size: 13px; line-height: 1; cursor: pointer; opacity: .55; }
tr:hover td.fila-borrar button, .cot-item:hover .cot-borrar button { opacity: 1; }
td.fila-borrar button:hover, .cot-borrar button:hover { color: var(--red); border-color: #f1caca; background: var(--red-bg); }
@media (max-width: 700px) {
  table.tabla-responsiva td.fila-borrar { justify-content: flex-end; width: 100%; padding: 4px 0 0; }
  table.tabla-responsiva td.fila-borrar::before { content: none; }
  td.fila-borrar button { opacity: 1; }
}

/* Proyecto: la lista de cotizaciones (de dónde vino cada una, total, acciones y borrar) */
.cot-lista { list-style: none; margin: 0 0 14px; padding: 0; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; background: #fff; }
.cot-item, .cot-lista-cab { display: grid; grid-template-columns: 150px minmax(0, 1fr) 120px auto 30px; gap: 12px; align-items: center; padding: 11px 14px; }
.cot-item + .cot-item { border-top: 1px solid var(--linea); }
.cot-item:hover { background: var(--hover); }
.cot-lista-cab { padding-top: 8px; padding-bottom: 8px; background: var(--superficie); border-bottom: 1px solid var(--border);
  font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.cot-lista-cab span:nth-child(3) { text-align: right; }
.cot-origen { justify-self: start; display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding: 3px 9px; border-radius: 999px; font-size: 11px; font-weight: 700; border: 1px solid var(--border); background: var(--superficie); color: var(--text); }
.cot-origen.o-nw { background: var(--carbon); border-color: var(--carbon); color: var(--amarillo); }
.cot-origen.o-red { background: #e8f1ff; border-color: #bcd3fb; color: #1d4ed8; }
.cot-origen.o-propia { background: #fff; }
.cot-origen.o-presu { background: #fff7dc; border-color: #f0dc9c; color: var(--orange); font-weight: 600; }
.cot-datos { display: flex; flex-direction: column; gap: 1px; min-width: 0; font-size: 13.5px; }
.cot-datos a { color: var(--text); text-decoration: none; }
.cot-datos a:hover strong { text-decoration: underline; text-decoration-color: var(--amarillo); }
.cot-datos .muted { font-size: 12px; overflow-wrap: anywhere; }
.cot-estado { font-size: 11.5px; color: var(--muted); }
.cot-total { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cot-total .muted { display: block; font-size: 11px; font-weight: 500; }
.cot-acciones { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; align-items: center; }
.cot-acciones form { margin: 0; }
.cot-acciones .desplegable { display: inline-block; }
.cot-acciones .desplegable > summary { list-style: none; }
.cot-acciones .desplegable > summary::-webkit-details-marker { display: none; }
.red-cambios { display: flex; gap: 6px; margin-top: 6px; }
.cot-borrar { margin: 0; justify-self: end; }
.cot-sub { background: #fdfcf8; }
.cot-sub .cot-origen { margin-left: 14px; }
.cot-sub .cot-origen::before { content: "↳ "; }
@media (max-width: 760px) {
  .cot-lista-cab { display: none; }
  .cot-item { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "origen borrar" "datos total" "acciones acciones"; row-gap: 8px; }
  .cot-item .cot-origen { grid-area: origen; } .cot-item .cot-borrar { grid-area: borrar; } .cot-item .cot-datos { grid-area: datos; }
  .cot-item .cot-total { grid-area: total; } .cot-item .cot-acciones { grid-area: acciones; justify-content: flex-start; }
  .cot-borrar button { opacity: 1; }
}
/* lista de cotizaciones: los botones van en un segundo renglón (la columna del proyecto es angosta) */
.cot-item, .cot-lista-cab { grid-template-columns: 132px minmax(0, 1fr) auto 28px; grid-template-areas: "origen datos total borrar"; row-gap: 8px; }
.cot-item { grid-template-areas: "origen datos total borrar" ". acciones acciones acciones"; }
.cot-item .cot-origen { grid-area: origen; } .cot-item .cot-datos { grid-area: datos; } .cot-item .cot-total { grid-area: total; }
.cot-item .cot-borrar { grid-area: borrar; } .cot-item .cot-acciones { grid-area: acciones; justify-content: flex-start; }
.cot-datos strong { white-space: nowrap; }
.cot-sub .cot-origen { margin-left: 10px; }
@media (max-width: 760px) {
  .cot-item { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "origen borrar" "datos total" "acciones acciones"; }
}

/* Proyecto: historial plegado (las últimas 3 a la vista) */
.historial-mas > summary { list-style: none; margin: 4px 0 8px; }
.historial-mas > summary::-webkit-details-marker { display: none; }
.historial-mas[open] > summary { margin-bottom: 4px; }

/* Glosario: cada término se despliega */
.pri-termino { border-bottom: 1px solid var(--linea); }
.pri-termino > summary { list-style: none; cursor: pointer; padding: 11px 2px; display: flex; justify-content: space-between; align-items: center; }
.pri-termino > summary::-webkit-details-marker { display: none; }
.pri-termino > summary::after { content: "+"; color: var(--suave); font-weight: 700; }
.pri-termino[open] > summary::after { content: "–"; }
.pri-termino > summary dt { margin: 0; font-weight: 700; }
.pri-termino > dd { margin: 0 0 12px; padding: 0 2px; }
.pri-termino > summary:hover dt { text-decoration: underline; text-decoration-color: var(--amarillo); }
/* Mercado: tablas que entran en el ancho (sin scroll lateral en compu) */
.t-linea { min-width: 112px; }
.t-tabla td.pub-acciones { white-space: normal; width: 1%; text-align: right; }
.t-tabla td.pub-acciones .en-linea, .t-tabla td.pub-acciones .desplegable { display: inline-flex; margin: 2px 0 2px 6px; }
.t-tabla td.pub-acciones .desplegable[open] { display: block; }
.t-tabla td { padding: 9px 10px; }
@media (max-width: 700px) {
  .t-tabla td.pub-acciones { width: 100%; justify-content: flex-end; flex-wrap: wrap; }
  .t-tabla td.pub-acciones .en-linea, .t-tabla td.pub-acciones .desplegable { margin: 2px 0 2px 8px; }
  .pub-editar { min-width: 0; }
}
.pri-glosario .pri-termino { display: block; padding: 0; margin: 0; }
.pri-glosario .pri-termino > summary { padding: 9px 2px; }
/* Guía del importador (Mi primera importación): índice, capítulos, «Antes de pagar al proveedor» y mensajes modelo.
   Criterio: tipografía y líneas finas, sin rellenos de color; el amarillo solo como acento. */
.pri-guia-inicio { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 24px; align-items: start; }
.pri-guia-etq { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--suave); margin-bottom: 6px; }
/* índice */
.pri-guia-indice { list-style: none; margin: 0; padding: 0; }
.pri-guia-indice li + li { border-top: 1px solid var(--linea); }
.pri-guia-indice a { display: grid; grid-template-columns: 44px minmax(0, 1fr) 16px; align-items: center; gap: 8px; padding: 18px 22px;
                     color: inherit; text-decoration: none; transition: background .15s; }
.pri-guia-indice a:hover { background: var(--hover); }
.pri-guia-num { font-size: 12px; font-weight: 600; letter-spacing: .08em; color: var(--suave); font-variant-numeric: tabular-nums; }
.pri-guia-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pri-guia-txt strong { font-size: 14.5px; font-weight: 600; }
.pri-guia-txt small { color: var(--muted); font-size: 12.5px; }
.pri-guia-ir { width: 7px; height: 7px; border-top: 1.5px solid var(--suave); border-right: 1.5px solid var(--suave); transform: rotate(45deg); transition: transform .15s; }
.pri-guia-indice a:hover .pri-guia-ir { border-color: var(--text); transform: translateX(2px) rotate(45deg); }
.pri-guia-nota { margin: 12px 4px 0; }
/* capítulo */
.pri-guia-miga { display: flex; gap: 10px; align-items: center; font-size: 11.5px; letter-spacing: .04em; color: var(--suave); margin-bottom: 4px; }
.pri-guia-miga a { color: var(--muted); text-decoration: none; }
.pri-guia-miga a:hover { color: var(--text); }
.pri-guia-miga span::before { content: "/"; margin-right: 10px; color: var(--border); }
.pri-guia-cuerpo { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 28px; align-items: start; }
.pri-guia-lateral { position: sticky; top: 16px; }
.pri-guia-lateral ol { list-style: none; margin: 0; padding: 0; }
.pri-guia-lateral a { display: flex; gap: 10px; padding: 8px 12px; border-left: 1px solid var(--border); color: var(--muted); text-decoration: none; font-size: 13px; }
.pri-guia-lateral a span { color: var(--suave); font-size: 11.5px; font-variant-numeric: tabular-nums; padding-top: 1px; }
.pri-guia-lateral a:hover { color: var(--text); }
.pri-guia-lateral a.activo { color: var(--text); font-weight: 600; border-left: 2px solid var(--amarillo); padding-left: 11px; }
.card.pri-guia-cap { max-width: 800px; padding: 30px 36px; }
.pri-guia-cap p, .pri-guia-cap li { line-height: 1.65; }
.pri-guia-cap strong { font-weight: 600; }
.pri-guia-resumen { border-left: 2px solid var(--amarillo); padding: 2px 0 2px 18px; margin: 0 0 18px; }
.pri-guia-resumen ul { margin: 0; padding: 0; list-style: none; }
.pri-guia-resumen li { margin: 6px 0; padding-left: 14px; position: relative; }
.pri-guia-resumen li::before { content: ""; position: absolute; left: 0; top: .8em; width: 6px; height: 1px; background: var(--muted); }
.pri-guia-sec { border-top: 1px solid var(--linea); }
.pri-guia-sec:last-of-type { border-bottom: 1px solid var(--linea); }
.pri-guia-sec > summary { list-style: none; cursor: pointer; padding: 16px 0; font-weight: 600; font-size: 14.5px; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.pri-guia-sec > summary::-webkit-details-marker { display: none; }
.pri-guia-sec > summary::after { content: ""; flex: none; width: 7px; height: 7px; border-right: 1.5px solid var(--suave); border-bottom: 1.5px solid var(--suave);
                                 transform: translateY(-2px) rotate(45deg); transition: transform .2s; }
.pri-guia-sec[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
.pri-guia-sec > summary:hover::after { border-color: var(--text); }
.pri-guia-sec > :not(summary) { margin-top: 0; }
.pri-guia-sec > :last-child { margin-bottom: 20px; }
.pri-guia-sec ul, .pri-guia-sec ol { padding-left: 18px; }
.pri-guia-sec li { margin: 7px 0; }
.pri-guia-sec li::marker { color: var(--suave); }
.pri-guia-pasos { counter-reset: paso; list-style: none; padding-left: 0 !important; }
.pri-guia-pasos li { counter-increment: paso; position: relative; padding-left: 34px; margin: 10px 0; }
.pri-guia-pasos li::before { content: counter(paso); position: absolute; left: 0; top: 2px; width: 22px; height: 22px; border-radius: 50%;
                             border: 1px solid var(--border); font-size: 11px; font-weight: 600; color: var(--muted); display: grid; place-items: center; }
.pri-guia-notas { font-size: 12.5px; color: var(--muted); }
.pri-guia-fuente { font-size: 11.5px; color: var(--suave); margin: 10px 0 0; }
/* tablas */
.pri-guia-sec .tabla-scroll { box-shadow: none; border-color: var(--linea); margin: 4px 0 12px; }
.pri-guia-tabla { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 13px; }
.pri-guia-tabla th, .pri-guia-tabla td { padding: 11px 14px; border-bottom: 1px solid var(--linea); text-align: left; vertical-align: top; line-height: 1.5; }
.pri-guia-tabla tr:last-child td { border-bottom: 0; }
.pri-guia-tabla th { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); background: transparent; }
.pri-guia-tabla td:first-child { color: var(--muted); }
.pri-guia-tabla td:first-child strong { color: var(--text); }
.pri-guia-tabla small { display: block; font-weight: 400; color: var(--suave); font-size: 11.5px; text-transform: none; letter-spacing: 0; margin-top: 2px; }
.pri-guia-tabla td.si, .pri-guia-tabla td.no { font-weight: 600; }
.pri-guia-tabla td.si::before, .pri-guia-tabla td.no::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 8px; vertical-align: 2px; }
.pri-guia-tabla td.si::before { background: var(--green); }
.pri-guia-tabla td.no { color: var(--muted); }
.pri-guia-tabla td.no::before { background: var(--border); }
/* mensajes modelo */
.pri-guia-mensajes { margin-top: 28px; }
.card .pri-guia-mensajes h2 { font-family: var(--fuente); text-transform: none; letter-spacing: 0; font-size: 16px; font-weight: 600; color: var(--text); margin: 0 0 4px; }
.pri-guia-msj { border-top: 1px solid var(--linea); }
.pri-guia-msj:last-child { border-bottom: 1px solid var(--linea); }
.pri-guia-msj > summary { cursor: pointer; padding: 13px 0; font-weight: 500; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.pri-guia-msj > summary::-webkit-details-marker { display: none; }
.pri-guia-msj > summary::after { content: ""; width: 6px; height: 6px; border-right: 1.5px solid var(--suave); border-bottom: 1.5px solid var(--suave); transform: rotate(45deg); transition: transform .2s; }
.pri-guia-msj[open] > summary::after { transform: rotate(-135deg); }
.pri-guia-msj > p { margin: 0 0 8px; }
.pri-guia-msj textarea { width: 100%; font: 12.5px/1.6 ui-monospace, "SF Mono", Consolas, monospace; padding: 14px 16px; border: 1px solid var(--linea);
                         border-radius: var(--radio); background: var(--hover); color: var(--text); resize: vertical; }
.pri-guia-msj .btn { margin: 8px 0 14px; }
/* servicio NETWISE y navegación entre capítulos */
.pri-guia-servicio { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 28px;
                     padding: 18px 20px; background: var(--hover); border: 1px solid var(--linea); border-radius: var(--radio); }
.pri-guia-servicio > div { display: flex; flex-direction: column; gap: 2px; max-width: 480px; }
.pri-guia-servicio .pri-guia-etq { margin-bottom: 2px; }
.pri-guia-servicio strong { font-weight: 600; }
.pri-guia-pasar { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--linea); }
.pri-guia-pasar a { display: flex; flex-direction: column; gap: 2px; color: var(--text); text-decoration: none; font-weight: 600; font-size: 13.5px; }
.pri-guia-pasar small { font-size: 10.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--suave); }
.pri-guia-pasar a:hover { color: var(--muted); }
.pri-guia-sig { text-align: right; align-items: flex-end; grid-column: 2; }
.pri-guia-tip { margin: 14px 0 0; padding-top: 12px; border-top: 1px solid var(--border); font-size: 12.5px; color: var(--muted); }
/* antes de pagar al proveedor */
.card.pri-antes { padding: 20px 22px; }
.pri-antes-cabeza { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.card.pri-antes h2 { font-family: var(--fuente); text-transform: none; letter-spacing: 0; font-size: 14px; font-weight: 600; color: var(--text); margin: 0; }
.pri-antes-cuenta { font-size: 12px; font-weight: 600; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pri-antes-barra { display: block; height: 2px; background: var(--linea); border-radius: 2px; margin: 12px 0 6px; overflow: hidden; }
.pri-antes-barra span { display: block; height: 100%; background: var(--amarillo); transition: width .25s; }
.pri-antes ul { list-style: none; margin: 0; padding: 0; }
.pri-antes li { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 10px 0; border-top: 1px solid var(--linea); }
.pri-antes li:first-child { border-top: 0; }
.pri-antes label { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; font-weight: 400; font-size: 12.5px; line-height: 1.5; color: var(--text); }
.pri-antes input { margin-top: 2px; flex: none; }
.pri-antes input:checked + span { color: var(--suave); }
.pri-antes-ver { flex: none; width: 7px; height: 7px; margin-top: 6px; border-top: 1.5px solid var(--suave); border-right: 1.5px solid var(--suave); transform: rotate(45deg); }
.pri-antes-ver:hover { border-color: var(--text); }
.camino-ahora .pri-antes { margin-top: 16px; box-shadow: none; }
@media (max-width: 900px) {
  .pri-guia-inicio, .pri-guia-cuerpo { grid-template-columns: minmax(0, 1fr); }
  .pri-guia-lateral { display: none; }
  .card.pri-guia-cap { padding: 20px 18px; }
  .pri-guia-indice a { padding: 16px; grid-template-columns: 34px minmax(0, 1fr) 14px; }
}
/* Exportables: nombres de documento largos (agente con razón social larga) bajan de línea en celular */
.exp-docs li > span:first-child strong, .exp-docs li > span:first-child .muted { overflow-wrap: anywhere; }
/* Operaciones: columnas fijas, iguales en Marítimas, Aéreas y Terrestres; la línea BL · shipper se corta con «…» en vez de ensanchar la tabla */
@media (min-width: 701px) {
  table.tabla-ops { table-layout: fixed; }
  table.tabla-ops th:nth-child(1) { width: auto; }
  table.tabla-ops th:nth-child(2) { width: 15%; }
  table.tabla-ops th:nth-child(3) { width: 22%; }
  table.tabla-ops th:nth-child(4) { width: 14%; }
  table.tabla-ops th.fila-borrar { width: 44px; }
  table.tabla-ops td.nombre a { overflow-wrap: anywhere; }
}
/* Ícono de documento (links a archivos): línea fina, sin emoji */
.ic-doc { display: inline-block; width: 9px; height: 11px; margin-right: 7px; vertical-align: -1px; border: 1.3px solid var(--suave);
          border-radius: 1.5px; position: relative; }
.ic-doc::after { content: ""; position: absolute; left: 1.5px; right: 1.5px; top: 3px; height: 3px; border-top: 1px solid var(--suave); border-bottom: 1px solid var(--suave); }
/* Mi primera importación: ayuda en una fila de cuatro; logro de la graduación (círculo con tilde, sin emoji) */
.caratula-grilla.pri-ayuda { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 960px) { .caratula-grilla.pri-ayuda { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pri-logro { display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--amarillo); font-size: 0; }
.pri-logro::before { content: ""; width: 18px; height: 9px; border-left: 3px solid var(--carbon); border-bottom: 3px solid var(--carbon); transform: translateY(-2px) rotate(-45deg); }
/* Operaciones en celular: la ✕ de borrar va en la esquina de la tarjeta, no en un renglón propio */
@media (max-width: 700px) {
  table.tabla-ops tr { position: relative; }
  table.tabla-ops td.fila-borrar { position: absolute; right: 8px; bottom: 8px; width: auto; padding: 0; }
}
/* Pedir cotización: opciones de entrega legibles */
.cot-destino strong { font-size: 13px; }
.cot-destino small { font-size: 12px; line-height: 1.45; }
/* Costos: con cuatro índices (cuando hay recupero), grilla de 2 × 2 en vez de 3 + 1 suelto */
.pri-indices:has(> :nth-child(4)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* Carátulas con exactamente cuatro tarjetas: una fila de cuatro (en vez de 3 + 1 suelta) */
@media (min-width: 961px) { .caratula-grilla:has(> :nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.pedido-enviado .camino-acciones { margin-top: 10px; }
.onb-mas { margin: -12px 0 18px; }
.onb-mas summary { cursor: pointer; color: #c9c9ce; font-size: 13px; }
.onb-mas ul { margin: 10px 0 0; }

/* ---- Cuentas: agrupadas por tipo, una línea por cuenta que se despliega */
.cuentas-buscar { margin: 18px 0 6px; }
.cuentas-buscar input { max-width: 360px; }
.cuentas-grupo { margin-top: 18px; }
.cuentas-grupo > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; padding: 8px 0;
                           border-bottom: 1px solid var(--border); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.cuentas-grupo > summary::-webkit-details-marker { display: none; }
.cuentas-grupo > summary::before { content: "▸"; color: var(--muted); }
.cuentas-grupo[open] > summary::before { content: "▾"; }
.cg-vacio { margin: 10px 0 0; }
.cuenta-fila { background: var(--card); border: 1px solid var(--border); border-radius: var(--radio); margin-top: 8px; }
.cuenta-fila > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(0, 1.4fr) auto minmax(0, 1fr) 16px;
                         gap: 14px; align-items: center; padding: 12px 16px; }
.cuenta-fila > summary::-webkit-details-marker { display: none; }
.cuenta-fila > summary:hover { background: var(--hover); }
.cuenta-fila[open] > summary { border-bottom: 1px solid var(--linea); }
.cf-nombre, .cf-usuario { display: flex; flex-direction: column; min-width: 0; overflow-wrap: anywhere; }
.cf-nombre .meta, .cf-usuario .meta { font-size: 12px; color: var(--muted); }
.cf-usuario { font-size: 13px; }
.cf-chips { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.cf-chip { border: 1px solid var(--border); border-radius: 999px; padding: 2px 9px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.cf-chip.pro { border-color: var(--amarillo-h); background: var(--orange-bg); }
.cf-chip.alerta { border-color: var(--red); color: var(--red); }
.cf-flecha::before { content: "▾"; color: var(--muted); }
.cuenta-fila[open] .cf-flecha::before { content: "▴"; }
.cf-cuerpo { padding: 14px 16px 16px; display: grid; gap: 14px; }
.cf-ajustes { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.cf-ajustes form { margin: 0; }
.cf-ajustes .cf-ubicacion { grid-column: span 2; }
.cf-ajustes .en-linea { display: flex; gap: 6px; flex-wrap: wrap; }
.cf-ajustes .en-linea input { flex: 1; min-width: 110px; }
.cf-bloque { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; border-top: 1px solid var(--linea); padding-top: 12px; }
.cf-bloque form { margin: 0; }
.cf-etq { font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); min-width: 80px; }
.cf-opciones { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.cf-usuarios { display: grid; gap: 8px; flex: 1; min-width: 0; }
.cf-u { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; justify-content: space-between; font-size: 13px; }
.cf-acciones { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; border-top: 1px solid var(--linea); padding-top: 12px; }
.cf-acciones > .muted { margin-left: auto; }
.alta-cuentas { margin-top: 28px; max-width: 820px; }
.alta-cuentas > summary { list-style: none; cursor: pointer; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.alta-cuentas > summary::-webkit-details-marker { display: none; }
.alta-cuentas > summary h2 { margin: 0; }
.alta-cuentas[open] > summary { margin-bottom: 14px; }
.alta-cuentas .registro-estado { border-bottom: 1px solid var(--linea); padding-bottom: 14px; margin-bottom: 16px; }
@media (max-width: 720px) {
  .cuenta-fila > summary { grid-template-columns: minmax(0, 1fr) 16px; }
  .cf-chips { justify-content: flex-start; grid-column: 1; }
  .cf-usuario { grid-column: 1; }
  .cf-ajustes .cf-ubicacion { grid-column: auto; }
}

/* ---- Costos: exportar la simulación a PDF */
.c-pdf-cabeza { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.c-pdf-cabeza h2 { margin: 0; }
.c-pdf-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0; }
.c-pdf-form input { width: 200px; max-width: 100%; }

/* ---- Carátula del agente: primeros pasos en la red */
.pasos-agente { margin-bottom: 18px; }
.pasos-cabeza { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.pasos-cabeza h2 { margin: 0 0 10px; }
.pasos-lista { list-style: none; margin: 0; padding: 0; display: grid; }
.pasos-lista li { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid var(--linea); }
.pasos-lista li > div { display: flex; flex-direction: column; min-width: 0; }
.pasos-lista .camino-num { width: 26px; height: 26px; border-radius: 50%; border: 1.5px solid var(--border); display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; }
.pasos-lista li.hecho .camino-num { background: var(--carbon); border-color: var(--carbon); color: #fff; }
.pasos-lista li.hecho strong { color: var(--muted); font-weight: 600; }
.pasos-lista li.actual .camino-num { border-color: var(--amarillo-h); background: var(--amarillo); }
@media (max-width: 600px) { .pasos-lista li { grid-template-columns: 32px minmax(0, 1fr); } .pasos-lista li .btn { grid-column: 2; justify-self: start; } }

/* ---- Plataforma: tablero de NETWISE */
.pl-periodo { display: inline-flex; border: 1px solid var(--border); border-radius: 999px; overflow: hidden; background: var(--card); }
.pl-periodo a { padding: 7px 14px; font-size: 13px; font-weight: 600; color: var(--muted); text-decoration: none; }
.pl-periodo a.activo { background: var(--carbon); color: #fff; }
.pl-seccion { margin-top: 26px; }
.pl-titulo { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin: 0 0 12px; display: flex; gap: 10px; align-items: baseline;
             font-family: var(--fuente); }
.pl-titulo .muted { text-transform: none; letter-spacing: 0; font-weight: 500; }
.pl-sub { font-size: 13px; font-weight: 700; margin: 16px 0 8px; }
.pl-grupos { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; align-items: start; }
.pl-grupo { padding: 0; }
.pl-grupo > summary { list-style: none; cursor: pointer; display: flex; gap: 14px; align-items: center; padding: 14px 16px; }
.pl-grupo > summary::-webkit-details-marker { display: none; }
.pl-grupo[open] > summary { border-bottom: 1px solid var(--linea); }
.pl-cifra { font-family: var(--fuente-titulos); font-size: 34px; line-height: 1; min-width: 34px; }
.pl-grupo.vacio .pl-cifra { color: var(--suave); }
.pl-grupo.demora { border-left: 3px solid var(--red); }
.pl-nombre { display: flex; flex-direction: column; min-width: 0; }
.pl-nombre small { color: var(--muted); font-size: 12px; }
.pl-grupo.demora .pl-nombre small { color: var(--red); }
.pl-ayuda { margin: 10px 16px 0; }
.pl-items { list-style: none; margin: 0; padding: 4px 16px 10px; }
.pl-items li { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--linea); align-items: baseline; }
.pl-items li:last-child { border-bottom: 0; }
.pl-items a { display: flex; flex-direction: column; min-width: 0; text-decoration: none; color: var(--text); }
.pl-items a span { font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.pl-items em { font-style: normal; font-size: 12px; color: var(--muted); white-space: nowrap; }
.pl-items em.tarde { color: var(--red); font-weight: 600; }
.pl-grupo > .link-accion { display: inline-block; margin: 0 16px 12px; }
.pl-tabla { padding: 4px 16px 12px; }
.pl-tabla .num { text-align: right; font-variant-numeric: tabular-nums; }
.pl-contactar { font-size: 12.5px; font-weight: 600; color: var(--orange); }
.pl-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.pl-kpi { background: var(--card); border: 1px solid var(--border); border-radius: var(--radio); padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
.pl-kpi span { font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.pl-kpi strong { font-family: var(--fuente-titulos); font-size: 30px; font-weight: 400; line-height: 1.1; font-variant-numeric: tabular-nums; }
.pl-kpi small { font-size: 12px; color: var(--muted); }
.pl-cuentas { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 12px; align-items: start; }
.pl-nuevas { padding: 14px 16px; }
.pl-nuevas .pl-items { padding: 0; }
@media (max-width: 800px) { .pl-cuentas { grid-template-columns: 1fr; } }
.pl-grupo > summary { text-align: left; justify-content: flex-start; }
.pl-nombre { align-items: flex-start; }
.pl-kpi strong { text-transform: none; }

.cf-limpiar { max-width: 560px; }
.cf-limpiar .en-linea { display: flex; gap: 6px; flex-wrap: wrap; }
.cf-limpiar input { flex: 1; min-width: 200px; }

/* ---- Mercado · Oportunidades: filtros y vista de mapa */
.t-vista { display: inline-flex; border: 1.5px solid var(--carbon); }
.t-vista label { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; font-size: 12px; font-weight: 700; letter-spacing: .08em;
                 text-transform: uppercase; cursor: pointer; }
.t-vista input { accent-color: var(--carbon); }
.t-vista label:has(input:checked) { background: var(--carbon); color: #fff; }
.t-mapa-opciones { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.t-mapa { border: 1.5px solid var(--carbon); margin-top: 10px; }
.t-mapa .mapa-lienzo { height: 460px; }
.t-mapa-pie { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 8px 12px; font-size: 12px; border-top: 1px solid var(--border); }
.t-mapa-leyenda { display: flex; gap: 12px; flex-wrap: wrap; }
.t-mapa-leyenda span { display: inline-flex; align-items: center; gap: 5px; }
.t-punto { width: 10px; height: 10px; border-radius: 50%; display: inline-block; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.35); }
.t-pin { width: 18px; height: 18px; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.45); display: flex;
         align-items: center; justify-content: center; color: #fff; font: 700 10px/1 var(--fuente); }
.t-pop strong { display: block; margin-bottom: 4px; }
.t-pop .t-sub { display: block; }
.t-pop .t-boton { margin-top: 8px; display: inline-block; }
@media (max-width: 700px) { .t-mapa .mapa-lienzo { height: 360px; } }
.t-tabla tr.t-marcada td { background: #fff7cc; transition: background .4s; }

/* ================================================================ Mercado · diseño 2 (09/10)
   Cuadrado y minimalista, más refinado: líneas finas, la ruta como dato principal (tipografía de títulos), un color por
   tipo de envío (el mismo del mapa), números monoespaciados y aire entre filas. Reemplaza lo de «estilo terminal». */
.terminal { --t-linea: #e7e5df; --t-fondo: #fbfaf7; --t-cab: #f6f5f1; --t-osc: #141416; --t-tinta: #1b1b1e; }
/* Encabezado: bloque oscuro con el título, la bajada y los créditos; debajo, los indicadores en una franja fina */
.t-cabeza { border: 0; border-bottom: 3px solid var(--amarillo); padding: 30px 34px 26px; margin-top: 4px; align-items: flex-end; }
.t-cabeza h1 { font-size: 46px; letter-spacing: .05em; line-height: 1; margin: 8px 0 10px; }
.t-cabeza p { font-size: 13.5px; line-height: 1.55; color: #a9a9b0; }
.t-eyebrow { letter-spacing: .2em; font-size: 10.5px; }
.t-creditos { border-left: 1px solid #2c2c31; padding: 4px 0 2px 28px; }
.t-creditos .t-etq { color: #8d8d95; letter-spacing: .16em; }
.t-creditos .t-num { font-family: var(--fuente-titulos); font-weight: 400; font-size: 52px; line-height: .95; }
.t-kpis { border: 0; border-bottom: 1px solid var(--t-linea); background: transparent; margin-bottom: 4px; }
.t-kpi { border-right: 1px solid var(--t-linea); padding: 16px 20px 14px; }
.t-kpi .t-etq { font-size: 10px; letter-spacing: .16em; }
.t-kpi .t-num { font-family: var(--fuente-titulos); font-weight: 400; font-size: 36px; line-height: 1; margin-top: 6px; color: var(--t-tinta); }
/* Navegación: Vidriera / Mis publicaciones y las pestañas, como rótulos con subrayado (sin cajas) */
.t-nav { border: 0; gap: 28px; margin: 22px 0 6px; }
.t-nav a { border: 0; padding: 6px 0; font-size: 12px; letter-spacing: .14em; color: var(--muted); border-bottom: 2px solid transparent; }
.t-nav a.activo { background: none; color: var(--t-tinta); border-bottom-color: var(--amarillo); }
.t-nav a:not(.activo):hover { background: none; color: var(--t-tinta); }
.t-tabs { border-bottom: 1px solid var(--t-linea); gap: 26px; margin: 14px 0 0; }
.t-tabs button { border: 0; padding: 12px 0 10px; letter-spacing: .12em; color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.t-tabs button.activa { background: none; color: var(--t-tinta); border-bottom-color: var(--t-tinta); }
.t-tabs button span { font-family: var(--t-mono); font-size: 11px; margin-left: 8px; padding: 1px 6px; background: var(--t-cab); color: var(--muted); opacity: 1; }
.t-tabs button.activa span { background: var(--t-tinta); color: #fff; }
.t-aviso { border: 1px solid #efe2a8; border-left: 3px solid var(--amarillo); background: #fffcef; justify-content: space-between; padding: 12px 16px; }
.t-panel { border-color: var(--t-linea); }
.t-panel-tit { background: #fff; letter-spacing: .14em; padding: 13px 16px; }
/* Filtros: una sola línea fina; a la derecha, «Lista / Mapa» */
.t-filtros { margin: 16px 0 0; border-color: var(--t-linea); align-items: stretch; }
.t-filtros input[type=search], .t-filtros select { border-right-color: var(--t-linea); padding: 12px 14px; font-size: 13.5px; background: #fff; }
.t-filtros .t-check { border-right: 1px solid var(--t-linea); }
.t-vista { margin-left: auto; border: 0; border-left: 1px solid var(--t-linea); }
.t-vista label { padding: 0 18px; gap: 0; letter-spacing: .14em; font-size: 11.5px; color: var(--muted); }
.t-vista input { position: absolute; opacity: 0; pointer-events: none; }
.t-vista label:has(input:checked) { background: var(--t-osc); color: #fff; }
.t-vista label:has(input:focus-visible) { outline: 2px solid var(--amarillo); outline-offset: -2px; }
/* El tablero: una fila por tarifa u oportunidad, con la franja del color de su tipo de envío */
.tb-lista { border: 1px solid var(--t-linea); border-top: 0; background: #fff; }
.tb-cabeza, .tb-fila { display: grid; gap: 22px; padding: 0 20px 0 22px; }
.tb-oferta { grid-template-columns: 170px minmax(0, 1.4fr) 150px minmax(0, 1fr) minmax(0, 1fr); }
.tb-opor { grid-template-columns: 170px minmax(0, 1.8fr) 160px minmax(0, 1.1fr); }
.tb-cabeza { padding-top: 9px; padding-bottom: 9px; background: var(--t-cab); border-bottom: 1px solid var(--t-linea);
             font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.tb-cabeza .num { text-align: right; }
.tb-fila { padding-top: 18px; padding-bottom: 18px; border-bottom: 1px solid var(--t-linea); position: relative; align-items: start;
           transition: background .15s; }
.tb-fila:last-child { border-bottom: 0; }
.tb-fila::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--modo, var(--t-linea)); }
.tb-fila:hover { background: var(--t-fondo); }
.tb-fila.tb-revision { background: #fffcef; }
.tb-fila.tb-marcada { background: #fff6cc; }
.tb-fila > div { min-width: 0; }
.tb-tipo { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.tb-modo { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--t-tinta); }
.tb-modo::before { content: ""; width: 8px; height: 8px; background: var(--modo, var(--muted)); flex: none; }
.tb-tipo .t-chip { margin: 0; }
.tb-ruta { font-family: var(--fuente-titulos); font-size: 25px; line-height: 1.05; letter-spacing: .03em; color: var(--t-tinta);
           display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; text-transform: uppercase; }
.tb-ruta i { font-style: normal; font-family: var(--fuente); font-size: 15px; color: var(--modo, var(--muted)); align-self: center; }
.tb-ruta .tb-sin { color: var(--suave); font-size: 18px; }
.tb-centro .t-sub { margin-top: 3px; }
.tb-titulo { display: block; margin-top: 6px; font-size: 13.5px; font-weight: 600; color: var(--t-tinta); }
.tb-centro .t-necesita { margin-top: 8px; }
.tb-centro .t-detalle summary { margin-top: 8px; }
.tb-precio { text-align: right; }
.tb-precio .t-precio { align-items: flex-end; }
.tb-precio .t-monto { font-size: 18px; }
.tb-precio .t-candado { font-size: 15px; }
.tb-cond { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; font-size: 12px; }
.tb-cond .t-chip { margin: 0 4px 0 0; }
.tb-validez { color: var(--muted); font-size: 11.5px; letter-spacing: .02em; white-space: nowrap; }
.tb-validez b { color: var(--t-tinta); font-weight: 600; margin-left: 2px; }
.tb-costo { font-size: 13px; font-weight: 700; padding: 2px 7px; border: 1px solid var(--t-linea); }
.tb-accion { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.tb-accion .t-acciones { margin-top: 0; }
.terminal .t-boton { padding: 7px 12px; letter-spacing: .1em; font-size: 11px; transition: background .15s; }
.terminal .t-boton.secundario:hover { background: var(--t-cab); }
.t-chip { border-color: var(--t-linea); font-size: 10px; letter-spacing: .08em; padding: 2px 7px; }
.t-contacto strong { font-size: 13px; }
/* Mapa: marco fino, barra de opciones arriba y estado abajo */
.t-mapa { border: 1px solid var(--t-linea); border-top: 0; margin-top: 0; background: #fff; }
.t-mapa-barra { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; align-items: center; padding: 10px 16px;
                border-bottom: 1px solid var(--t-linea); font-size: 12px; }
.t-mapa-opciones .t-check { padding: 0; }
.t-mapa .mapa-lienzo { height: 520px; border-radius: 0; }
.t-mapa-pie { border-top: 1px solid var(--t-linea); color: var(--muted); padding: 9px 16px; }
.t-mapa-leyenda { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.t-punto { border-radius: 0; width: 9px; height: 9px; border: 0; box-shadow: none; }
.t-pin { border-radius: 50%; width: 20px; height: 20px; border: 3px solid #fff; box-shadow: 0 1px 6px rgba(0,0,0,.35); font-size: 10px; }
.t-pop { font-family: var(--fuente); font-size: 12px; }
.t-pop strong { font-size: 13px; }
.t-pop-ruta { display: block; font-family: var(--fuente-titulos); font-size: 17px; letter-spacing: .03em; text-transform: uppercase; margin: 2px 0 4px; }
.t-pop-precio { display: block; font-family: var(--t-mono); font-weight: 700; font-size: 14px; margin-top: 4px; }
.t-pop-sep { border: 0; border-top: 1px solid #e7e5df; margin: 10px 0; }
.leaflet-popup-content-wrapper { border-radius: 2px; }
.t-vacio { border-color: var(--t-linea); padding: 36px; }
/* Mis publicaciones: la tabla, con el mismo trazo fino */
.t-tabla th { background: var(--t-cab); border-right: 0; font-size: 10px; letter-spacing: .16em; padding: 10px 14px; }
.t-tabla td { border-right: 0; padding: 14px; }
.t-tabla tbody tr:nth-child(even) td { background: #fff; }
.t-tabla tbody tr:hover td { background: var(--t-fondo); }
.t-tabla-tit { background: none; color: var(--t-tinta); border-bottom: 1px solid var(--t-linea); padding: 12px 0 8px; letter-spacing: .14em; }
.t-tabla-tit span { background: var(--t-tinta); color: #fff; padding: 1px 6px; }
@media (max-width: 960px) {
  .tb-cabeza { display: none; }
  .tb-oferta, .tb-opor { grid-template-columns: minmax(0, 1fr) auto; gap: 10px 16px; padding: 16px 16px 16px 18px; }
  .tb-tipo { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; align-items: center; }
  .tb-centro { grid-column: 1 / -1; }
  .tb-precio { grid-column: 2; grid-row: 1; }
  .tb-cond, .tb-accion { grid-column: 1 / -1; }
  .tb-ruta { font-size: 22px; }
  .t-vista { margin-left: 0; flex: 1 1 100%; border-left: 0; border-top: 1px solid var(--t-linea); }
  .t-vista label { flex: 1; justify-content: center; padding: 10px; }
  .t-cabeza h1 { font-size: 38px; }
  .t-creditos { border-left: 0; padding-left: 0; }
  .t-mapa .mapa-lienzo { height: 400px; }
}
/* El mapa base en grises, para que resalten los puntos de color */
.t-mapa .leaflet-tile-pane { filter: grayscale(1) contrast(.92) brightness(1.06); }

/* Cotización: moneda (pesos solo en operaciones dentro de Argentina) */
.cot-moneda-campo { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 4px 14px; align-items: center; }
.cot-moneda-campo label { grid-column: 1 / -1; }
.cot-moneda-campo[hidden] { display: none; }
@media (max-width: 700px) { .cot-moneda-campo { grid-template-columns: 1fr; } }

/* Ingreso: ¿Olvidó su contraseña? */
.lp-olvide { margin-top: 12px; font-size: 13px; }
.lp-olvide summary { cursor: pointer; color: var(--muted); }
.lp-olvide form { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.lp-olvide input[type=email] { flex: 1; min-width: 180px; }
.lp-olvide-ok { margin: 12px 0 0; }

/* «Reportar un problema»: botón fijo abajo a la derecha y su caja */
.reportar { position: fixed; right: 18px; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); z-index: 900; }
.reportar > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; background: var(--card);
                      border: 1px solid var(--border); border-radius: 999px; padding: 7px 14px 7px 8px; box-shadow: 0 4px 16px rgba(0,0,0,.12);
                      font-size: 12.5px; color: var(--text); }
.reportar > summary::-webkit-details-marker { display: none; }
.reportar > summary span { width: 22px; height: 22px; border-radius: 50%; background: var(--carbon); color: var(--amarillo);
                           display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 13px; }
.reportar > summary b { font-weight: 600; }
.reportar[open] > summary { display: none; }
.reportar-caja { width: min(360px, calc(100vw - 36px)); background: var(--card); border: 1px solid var(--border); border-top: 3px solid var(--amarillo);
                 box-shadow: 0 10px 30px rgba(0,0,0,.18); padding: 16px; display: grid; gap: 8px; }
.reportar-caja p { margin: 0; }
.reportar-caja textarea { width: 100%; }
.reportar-caja label { display: grid; gap: 4px; color: var(--muted); }
.reportar-acciones { display: flex; gap: 8px; }
.reportar-gracias { position: fixed; right: 18px; bottom: calc(70px + env(safe-area-inset-bottom, 0px)); z-index: 901; background: var(--carbon); color: #fff;
                    padding: 10px 14px; font-size: 13px; display: flex; gap: 10px; align-items: center; box-shadow: 0 6px 20px rgba(0,0,0,.2); }
.reportar-gracias button { background: none; border: 0; color: #fff; font-size: 16px; cursor: pointer; }
@media (max-width: 700px) { .reportar > summary b { display: none; } .reportar > summary { padding: 6px; } }
@media print { .reportar, .reportar-gracias { display: none; } }
.reportar-caja > * { min-width: 0; }
.reportar-caja textarea, .reportar-caja input[type=file] { width: 100%; max-width: 100%; box-sizing: border-box; }
.reportar-caja input[type=file] { font-size: 12px; }
.reportar-caja { box-sizing: border-box; overflow: hidden; }

/* Mercado: una línea que explica qué hay en cada pestaña */
.t-explica { margin: 14px 0 14px; padding: 0 0 0 12px; border-left: 2px solid var(--t-linea); color: var(--muted); font-size: 13px; line-height: 1.5; max-width: 760px; }
.t-explica strong { color: var(--t-tinta); font-weight: 600; }
/* Consultas: confirmación de lectura de las respuestas de NETWISE */
.pri-nueva { display: inline-block; margin-right: 6px; padding: 1px 7px; border-radius: 10px; background: var(--amarillo); font-size: 11px; font-weight: 700; vertical-align: 1px; }
.pri-leida { display: flex; align-items: center; justify-content: flex-end; gap: 12px; flex-wrap: wrap; margin: 4px 0 14px; font-size: 13px; color: var(--muted); }
