/* ==========================================================================
   Marca Nardone & Asociados (NEXNORM_MARCA=nardone)
   Se carga después de nexnorm.css y de las hojas de cada pantalla: pisa las variables --nx-*.
   Paleta: azul marino del logo (#122357) llevado a fondos y vidrios profundos; el dorado de
   NexNorm pasa a marfil / plata cálida y el cian a un azul claro. Rojo y verde de estado quedan.
   Contraste AA verificado (texto, botones, enlaces, chips, campos y foco): ver el reporte.
   ========================================================================== */

:root {
  --nx-fondo: #070E21;
  --nx-vidrio: #0F1D45;
  --nx-dorado: #DAD3C3;
  --nx-cian: #9CC3FF;

  --nx-dorado-claro: #F3EFE6;
  --nx-dorado-oscuro: #8F887A;
  --nx-texto: #EEF1F8;
  --nx-texto-2: #BCC6DC;
  --nx-texto-3: #98A5C4;

  --nx-fondo-rgb: 7, 14, 33;
  --nx-vidrio-rgb: 15, 29, 69;
  --nx-vidrio-2-rgb: 21, 40, 87;
  --nx-vidrio-3-rgb: 11, 22, 54;
  --nx-vidrio-hondo-rgb: 11, 22, 54;
  --nx-hondo-rgb: 4, 10, 26;
  --nx-velo-rgb: 3, 7, 18;
  --nx-dorado-rgb: 218, 211, 195;
  --nx-dorado-claro-rgb: 243, 239, 230;
  --nx-cian-rgb: 156, 195, 255;

  --nx-dorado-brillo: #FAF8F3;
  --nx-dorado-hondo: #B9B09C;
  --nx-destello: #F6F2EA;
  --nx-marfil: #FFFDF8;
  --nx-marfil-2: #FBF8F1;
  /* Texto sobre el acento claro (botones, contadores): el azul marino del logo, oscurecido. */
  --nx-sobre-dorado: #0E1B44;
  --nx-sobre-dorado-2: #0E1B44;
}

/* --- Logo del estudio sobre placa clara (panel, barra del celular, acceso y portal) --------- */
.nx-logo--estudio { display: inline-flex; max-width: 100%; border-radius: 12px; }
.nx-placa {
  display: inline-flex; align-items: center; justify-content: center;
  max-width: 100%;
  padding: 8px 12px;
  border-radius: 12px;
  background: #FFFFFF;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5), 0 10px 26px -14px rgba(0, 0, 0, 0.9);
}
.nx-placa-logo { display: block; width: auto; max-width: 100%; height: auto; }

/* Barra lateral del panel (PC): ocupa el ancho de la cabeza. */
.nx-placa--lateral { width: 100%; padding: 10px 12px; }
.nx-placa--lateral .nx-placa-logo { width: 100%; }

/* Barra superior del celular y del portal: alto fijo, el ancho sale de la proporción del logo. */
.nx-placa--barra { padding: 4px 8px; border-radius: 10px; }
.nx-placa--barra .nx-placa-logo { height: 40px; }

/* Pantalla de entrada: placa grande en la columna de la marca. */
/* La columna es flex en vertical: sin align-self la placa se estira a todo el ancho. */
.nx-acceso-marca .nx-logo--estudio { align-self: flex-start; }
.nx-placa--acceso { padding: 14px 20px; border-radius: 16px; }
.nx-placa--acceso .nx-placa-logo { width: 340px; }
@media (min-width: 900px) and (max-height: 860px) {
  /* Poca altura: la placa se achica con la pantalla para que el título no quede cortado. */
  .nx-placa--acceso { padding: 10px 16px; }
  .nx-placa--acceso .nx-placa-logo { width: clamp(200px, 32vh, 340px); }
}

@media (max-width: 899.98px) {
  .nx-placa--acceso { padding: 8px 12px; border-radius: 12px; }
  .nx-placa--acceso .nx-placa-logo { width: 220px; }
}

/* --- Monograma NexNorm donde quede (sitio sin logo propio, editor del sitio) ----------------
   Los colores del SVG son atributos; el CSS les gana. */
.nx-marca stop:nth-child(1) { stop-color: var(--nx-dorado-claro); }
.nx-marca stop:nth-child(2) { stop-color: var(--nx-dorado); }
.nx-marca linearGradient:first-of-type stop:nth-child(3) { stop-color: var(--nx-dorado-oscuro); }
.nx-marca linearGradient:last-of-type stop:nth-child(3) { stop-color: var(--nx-cian); }
.nx-marca .nx-marca-hex { fill: var(--nx-vidrio); }
.nx-marca .nx-marca-hex2 { stroke: var(--nx-dorado); }
.nx-marca .nx-marca-nodo { fill: var(--nx-cian); }