/* Las clases de la interfaz nueva de Samir (paso 3 del plan de Raúl, ti921 9e41795a §3 y §4.3). Copia fiel de
   clases-de-samir.css del paquete; se regenera desde ahí, no se edita a mano. Se carga después de app.css: el prefijo nd-
   no choca con nada nuestro. Las pantallas las usan a medida que se pasan (paso 4). */
/* Las clases del lienzo de Samir, juntadas de sus tableros, con el prefijo nd- (en los tableros van sin él).
   Los colores son las variables --nd- de tokens-de-samir.css. Si un selector cambia según el tablero, gana la
   versión que ve la mayoría de los tableros y las otras van en un comentario, con dónde se usan. Las columnas de
   cada tabla y el tono de cada píldora van en línea en el tablero: se leen ahí. Afuera quedan los #…:checked, el
   truco del lienzo para tocar sin JavaScript. */
.nd-sbw-e{display:flex}
.nd-sbw-c{display:none}
.nd-sbc-row{width:44px;height:44px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:var(--nd-cfg);text-decoration:none;flex:none;margin:2px 0;cursor:pointer}
.nd-sbc-row:hover{background:var(--nd-chover)}
.nd-sbc-row[aria-current]{background:var(--nd-cactive);color:var(--nd-oncactive)}
label.nd-sb-edge{cursor:pointer}
/* 33 tableros */
.nd-chip{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap;width:max-content}
.nd-seg{display:inline-flex;gap:2px;padding:4px;border-radius:999px;background:var(--nd-card);box-shadow:0 1px 2px rgba(23,36,58,.06)}
/* sólo en ExpedienteCelular: .nd-seg .nd-tab{height:40px;padding:0 13px;white-space:nowrap;font-size:13px} */
/* 32 tableros */
.nd-seg .nd-tab{height:36px;padding:0 18px}
.nd-sb-row{display:flex;align-items:center;gap:12px;height:44px;padding:0 16px;border-radius:999px;text-decoration:none;color:var(--nd-body);font-size:15px;flex:none}
.nd-sb-row:hover{background:var(--nd-hover)}
.nd-sb-row[aria-current]{background:var(--nd-active);color:var(--nd-onactive)}
.nd-sb-edge{width:24px;height:24px;border-radius:50%;background:var(--nd-card);color:var(--nd-chev);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 1px 2px rgba(23,36,58,.12),0 4px 10px -4px rgba(23,36,58,.3);z-index:2}
.nd-tab{height:36px;padding:0 16px;border-radius:999px;display:inline-flex;align-items:center;font-size:14px;color:var(--nd-muted);text-decoration:none}
.nd-tab:hover{color:var(--nd-ink)}
.nd-tab[aria-current]{background:var(--nd-active);color:var(--nd-onactive)}
.nd-card{background:var(--nd-card);border-radius:24px;padding:24px;box-sizing:border-box}
.nd-lbl{margin:0 0 14px;font-size:14px;font-weight:400;color:var(--nd-muted)}
.nd-kv{font-size:15px;color:var(--nd-ink);line-height:1.4;margin-top:12px}
.nd-kv span{display:block;font-size:13px;color:var(--nd-muted);margin-bottom:2px}
.nd-act{color:var(--nd-ink);font-size:14px;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.nd-act svg{color:var(--nd-chev)}
.nd-act:hover svg{color:var(--nd-ink)}
.nd-b-pri{height:36px;border:0;border-radius:999px;background:var(--nd-send);color:var(--nd-onsend);padding:0 18px;font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.nd-b-sec{height:36px;border:0;border-radius:999px;background:var(--nd-bruma);color:var(--nd-ink);padding:0 16px;font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.nd-b-sec:hover{background:var(--nd-bruma2)}
.nd-chv{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.nd-chv:hover{color:#fff}
.nd-cal-d{cursor:pointer;transition:color .12s}
.nd-cal-d:hover{color:#fff}
.nd-d-row{display:flex;align-items:center;min-height:64px;border-top:1px solid var(--nd-platino);padding:0 12px;margin:0 -12px;border-radius:14px;cursor:pointer;transition:background .12s}
.nd-d-row:hover{background:var(--nd-hover);border-top-color:transparent}
.nd-d-row:hover+.nd-d-row{border-top-color:transparent}
.nd-d-row:first-of-type{border-top:0}
.nd-cp{width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:var(--nd-muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:none;padding:0}
.nd-cp:hover{color:var(--nd-ink);background:var(--nd-hover)}
.nd-cp .nd-i-ok{display:none}
.nd-cp:focus .nd-i-copy{display:none}
.nd-cp:focus .nd-i-ok{display:inline;color:var(--nd-ink)}
.nd-sel{background:rgba(52,80,122,.20);border-radius:2px}
.nd-fpill{position:absolute;left:0;top:-54px;display:inline-flex;align-items:center;gap:2px;padding:4px;border-radius:999px;background:var(--nd-send);color:var(--nd-onsend);box-shadow:0 1px 2px rgba(23,36,58,.12),0 12px 32px -8px rgba(23,36,58,.4);font-family:"Hanken Grotesk",sans-serif;font-size:13px;font-weight:600;white-space:nowrap;z-index:4}
.nd-fpill span{height:32px;padding:0 12px;border-radius:999px;display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.nd-fpill span:hover{background:rgba(255,255,255,.12)}
.nd-t-row{display:grid;grid-template-columns:minmax(0,2.4fr) minmax(0,1.5fr) 128px minmax(0,1.3fr) 28px;gap:20px;align-items:center;min-height:64px;padding:0 12px;margin:0 -12px;border-radius:14px;text-decoration:none;border-top:1px solid var(--nd-platino);cursor:pointer;transition:background .12s}
.nd-t-row:hover{background:var(--nd-hover);border-top-color:transparent}
.nd-t-row:hover+.nd-t-row{border-top-color:transparent}
.nd-t-row:hover svg{color:var(--nd-ink)}
.nd-t-row[aria-current]{background:var(--nd-escarcha)}
.nd-t-head{border-top:0;font-size:12px;color:var(--nd-muted);letter-spacing:.01em}
.nd-t-head:hover{background:transparent}
.nd-t-head span{cursor:pointer}
/* sólo en Expedientes, ExpedientesCelular: .nd-flt{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--nd-muted);cursor:pointer;min-height:44px} */
/* 30 tableros */
.nd-flt{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--nd-muted);cursor:pointer;min-height:40px}
.nd-fx-open{display:none !important}
.nd-pg-row{display:flex;align-items:center;gap:14px;height:40px;padding:0 12px;border-radius:12px;text-decoration:none;transition:background .12s}
.nd-pg-row:hover{background:var(--nd-hover)}
.nd-ts-in{position:absolute;opacity:0;pointer-events:none}
.nd-ts{display:inline-flex;align-items:baseline;gap:2px;padding:2px;border-radius:999px;background:var(--nd-platino)}
.nd-ts label{display:inline-flex;align-items:center;justify-content:center;width:32px;height:28px;border-radius:999px;cursor:pointer;color:var(--nd-muted);font-family:'Newsreader',serif}
.nd-ts label:hover{color:var(--nd-ink)}
.nd-f-row{display:flex;gap:16px;align-items:flex-start;padding:18px 12px;margin:0 -12px;border-radius:14px;border-top:1px solid var(--nd-platino);text-decoration:none;transition:background .12s}
a.nd-f-row:hover{background:var(--nd-hover);border-top-color:transparent}
a.nd-f-row:hover+a.nd-f-row{border-top-color:transparent}
a.nd-f-row:hover svg{color:var(--nd-ink)}
/* 32 tableros */
.nd-m-tab{flex:1;display:flex;align-items:center;justify-content:center;height:56px;text-decoration:none;flex-direction:column;gap:3px;color:var(--nd-tabi);font-size:11px}
.nd-read{font-family:Newsreader,serif;font-size:18px;line-height:1.65;color:var(--nd-body)}
.nd-read p{margin:0 0 16px}
/* sólo en Ajustes, AjustesCelular, AjustesCuenta, Buscador, BuscadorCelular, Cuenta…: mark{background:var(--nd-escarcha);color:inherit;padding:0 2px;border-radius:3px} */
/* 16 tableros */
mark{background:var(--nd-escarcha);color:inherit;padding:1px 3px;border-radius:4px}
/* 28 tableros */
.nd-fld{display:flex;flex-direction:column;gap:6px;min-width:0}
.nd-fld label{font-size:13px;color:var(--nd-muted)}
/* 28 tableros */
.nd-fld input{height:44px;border:0;border-bottom:1px solid var(--nd-ceniza);background:transparent;font:inherit;font-size:15px;color:var(--nd-ink);outline:none;width:100%;box-sizing:border-box;min-width:0}
.nd-ev{position:absolute;left:84px;right:20px;display:flex;gap:12px;align-items:stretch;padding:12px 16px;border-radius:16px;background:var(--nd-evbg);text-decoration:none;box-sizing:border-box;transition:background .12s,box-shadow .12s}
.nd-ev:hover{background:var(--nd-card);box-shadow:0 1px 2px rgba(23,36,58,.08),0 12px 32px -8px rgba(23,36,58,.28)}
.nd-cal-d2{cursor:pointer}
.nd-ev-now{background:var(--nd-evnow);z-index:3}
.nd-ev-now:hover{background:var(--nd-evnow)}
.nd-ev-now span,.nd-ev-now div{color:var(--nd-onevnow) !important}
.nd-ev-now .nd-avt{background:rgba(255,255,255,.22) !important;box-shadow:0 0 0 2px var(--nd-evnow) !important}
.nd-cal-d2:hover{background:var(--nd-platino)}
.nd-ov{position:absolute;inset:0;background:var(--nd-dimc);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:20}
.nd-kbd{display:inline-flex;align-items:center;height:22px;padding:0 7px;border-radius:6px;background:var(--nd-platino);color:var(--nd-muted);font-size:11px;font-weight:600}
.nd-prow{display:flex;align-items:center;gap:14px;height:52px;padding:0 14px;border-radius:14px;text-decoration:none;color:var(--nd-ink);font-size:15px}
.nd-prow:hover{background:var(--nd-hover)}
.nd-prow .nd-pi{width:34px;height:34px;border-radius:10px;background:var(--nd-platino);display:inline-flex;align-items:center;justify-content:center;color:var(--nd-muted);flex:none}
.nd-grp{font-size:12px;color:var(--nd-muted);padding:14px 14px 6px}
.nd-nrow{display:flex;gap:14px;padding:16px 4px;border-top:1px solid var(--nd-platino);text-decoration:none}
.nd-nrow:first-of-type{border-top:0}
.nd-sw{width:42px;height:26px;border-radius:999px;background:var(--nd-ceniza);position:relative;flex:none}
.nd-sw::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.nd-sw.nd-on{background:var(--nd-active)}
.nd-sw.nd-on::after{left:19px}
.nd-radio{width:20px;height:20px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--nd-ceniza);flex:none;display:inline-flex;align-items:center;justify-content:center}
.nd-radio.nd-on{background:var(--nd-ink);box-shadow:none}
.nd-radio.nd-on::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--nd-card)}
.nd-setrow{display:flex;align-items:center;gap:14px;padding:16px 0;border-top:1px solid var(--nd-platino)}
/* 13 tableros */
.nd-mrow{padding:9px 12px;border-radius:10px;font-size:14px;cursor:pointer;color:var(--nd-ink)}
.nd-mrow:hover{background:var(--nd-hover)}
.nd-sb-edge:hover{color:var(--nd-ink)}
.nd-th-act{color:var(--nd-ink);font-size:14px;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.nd-th-act svg{width:16px;height:16px;color:var(--nd-chev);transition:color .12s}
.nd-th-act:hover svg{color:var(--nd-ink)}
.nd-th-pill{height:36px;border:0;border-radius:999px;background:var(--nd-bruma);color:var(--nd-ink);padding:0 16px;font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.nd-th-pill:hover{background:var(--nd-bruma2)}
.nd-th-ico{width:44px;height:44px;border:0;background:transparent;color:var(--nd-onblue2);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:20px;padding:0}
.nd-th-ico:hover{color:var(--nd-onblue)}
.nd-pv2{display:none}
.nd-m-row2{display:flex;align-items:center;gap:12px;padding:14px 0;text-decoration:none;border-top:1px solid var(--nd-platino)}
.nd-m-row2:first-child{border-top:0}
.nd-pas{padding:1.5px;border-radius:20px;box-shadow:0 12px 32px -12px rgba(23,36,58,.3)}
.nd-pas>div{border-radius:18.5px;padding:14px 16px;backdrop-filter:blur(16px)}
@keyframes nd-sh{0%{background-position:-240px 0}100%{background-position:240px 0}}
.nd-shim{background:linear-gradient(90deg,var(--nd-muted) 0%,var(--nd-ink) 40%,var(--nd-muted) 80%);background-size:480px 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:nd-sh 1.8s linear infinite}
.nd-b-pri,.nd-b-sec{white-space:nowrap}
.nd-m-row{display:flex;align-items:center;gap:12px;min-height:64px;text-decoration:none;border-top:1px solid var(--nd-platino);padding:0 12px;margin:0 -12px;border-radius:14px}
.nd-m-row:active{background:var(--nd-hover)}
.nd-m-row:first-child{border-top:0}
.nd-m-act{color:var(--nd-ink);font-size:14px;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:6px;min-height:44px}
.nd-m-act svg{width:16px;height:16px;color:var(--nd-chev)}
.nd-m-ico{width:44px;height:44px;border:0;background:transparent;color:var(--nd-onblue2);display:inline-flex;align-items:center;justify-content:center;font-size:22px;padding:0}
.nd-m-tab svg{width:26px;height:26px}
.nd-h3{margin:32px 0 14px;font-size:14px;font-weight:600;color:var(--nd-ink)}
.nd-note{margin:16px 0 0;font-size:13px;color:var(--nd-muted);line-height:1.5;max-width:880px}
.nd-rules{margin:24px 0 0;padding:0 0 0 18px;font-size:15px;color:var(--nd-body);line-height:1.6;max-width:880px}
.nd-rules li{margin:0 0 6px}

/* Agregado por nosotros, de la hoja Sistema: el foco de teclado es un anillo de tinta de 2 px separado 3 px;
   el campo enfocado pasa su línea a tinta de 2 px con el halo Hielo. */
:focus-visible{outline:2px solid var(--nd-ink);outline-offset:3px}
.nd-fld input:focus-visible,.nd-fld textarea:focus-visible,.nd-fld select:focus-visible{outline:none;border-bottom:2px solid var(--nd-ink);box-shadow:0 3px 0 0 var(--nd-hielo)}

/* Agregado por nosotros el 31-10: el marco de toda pantalla menos el Inicio, leído de los tableros Expedientes,
   Clientes, Expediente, Escritos y Escrito, y de sus versiones de celular (en ellos va en línea, por eso faltaba acá).
   Es el mismo en todas: el main (.nd-marco), la franja de arriba (las vistas al centro, o vacía, y la campana a la
   derecha), la columna de 1120 centrada y la cabecera. Medido en Expediente, a 1440 con la barra abierta y la página
   arriba de todo: la franja en y 20, la primera línea de la cabecera en y 104 y el título en x 312. */
.nd-marco{display:flex;flex-direction:column;min-height:100%;box-sizing:border-box;max-width:none;margin:0;padding:20px 40px 0 20px}
.nd-marco > *{flex-shrink:0}
.scroll:has(> .nd-marco){padding-top:0;padding-left:0;padding-right:0} /* sólo en la pantalla pasada: .scroll es de 27 */
.nd-franja{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:44px}
.nd-franja > .nd-seg{grid-column:2;margin:0}
.nd-franja .nd-seg .nd-tab{height:36px;padding:0 18px;font-size:14px}
.nd-franja > .nd-campana{position:static;grid-column:3;justify-self:end;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;color:var(--nd-muted)}
body:has(.nd-franja) > .nd-campana{display:none} /* la campana fija de base.html queda sólo para las pantallas sin pasar */
.nd-pagina{max-width:1120px;width:100%;margin:0 auto;flex:1;display:flex;flex-direction:column}
.nd-pagina > *{flex-shrink:0} /* con una tabla larga no se encoge nada: Expedientes con 223 aplastaba las vistas a 8 px */
.nd-cabecera{padding:40px 0 32px;display:flex;justify-content:space-between;gap:24px;align-items:flex-start}
.nd-cabecera-exp{padding-bottom:36px}
.nd-cabecera > div{min-width:0}
.nd-miga{display:block;width:fit-content;font-size:13px;line-height:21px;color:var(--nd-muted);text-decoration:none}
.nd-titulo{margin:0;font-family:'Bodoni Moda',serif;font-style:italic;font-weight:var(--nd-bw);font-size:48px;line-height:1.05;letter-spacing:-.01em;color:var(--nd-ink)}
.nd-miga + .nd-titulo{margin-top:10px}
.nd-bajada{margin:12px 0 0;font-size:22px;font-weight:300;line-height:1.3;letter-spacing:-.02em;color:var(--nd-body)}
.nd-meta{margin:10px 0 0;font-size:13px;line-height:1.4;color:var(--nd-muted)}
.nd-titulo + .nd-meta{margin-top:12px}
.nd-cabecera-acc{display:flex;gap:8px;align-items:center;flex:none}
.nd-vistas-cel{display:none}
/* En el celular (640 es el corte de app.css). En las listas la barra de arriba queda como está y las vistas van
   centradas debajo (ClientesCelular). En el expediente y el escrito la barra cambia entera: «‹ Expedientes» o
   «‹ Escritos» a la izquierda y «⋯» con las acciones a la derecha (ExpedienteCelular, EscritoCelular); las vistas del
   expediente van debajo de la cabecera, en .nd-vistas-cel. 56 es la barra fija de arriba (.nd-cel-arriba). */
@media (max-width:640px){
  .nd-seg .nd-tab{height:40px;padding:0 13px;font-size:13px;white-space:nowrap} /* las vistas del celular, como hasta hoy (ExpedienteCelular); en la franja, las de ClientesCelular */
  .nd-marco{padding:56px 16px 0}
  .nd-franja{display:flex;justify-content:center;height:auto;margin-top:6px}
  .nd-franja > .nd-campana{display:none}
  .nd-franja-exp > .nd-seg{display:none}
  .nd-vistas-cel{display:flex;justify-content:center;padding:20px 12px 16px}
  .nd-vistas-cel .nd-tab{height:40px;padding:0 13px;font-size:13px;white-space:nowrap}
  .nd-cabecera{padding:22px 0 20px;flex-direction:column}
  .nd-cabecera .nd-miga{display:none}
  .nd-cabecera-det{padding-top:14px} /* el título a 20 de la barra, como en ExpedienteCelular y EscritoCelular */
  .nd-cabecera-det .nd-cabecera-acc{display:none}
  .nd-cabecera-det:has(+ .nd-vistas-cel){padding-bottom:0}
  .nd-titulo{font-size:32px;line-height:1.1}
  .nd-bajada{margin-top:10px;font-size:18px}
  .nd-meta,.nd-titulo + .nd-meta{margin-top:8px}
}