:root {
  --nexo-verde: #00875d;
  --nexo-verde-oscuro: #006646;
  --nexo-fondo: #f0f2f5;
  --nexo-superficie: #e8ecf1;
  --nexo-texto: #2f3540;
  --nexo-texto-2: #5c6370;
  --nexo-verde-claro: #e6faf3;
  --nexo-logo: #003d38;
  --nexo-borde: rgba(47, 53, 64, 0.12);
  --nexo-borde-2: rgba(47, 53, 64, 0.2);
  --nexo-radio: 12px;

  --bs-primary: var(--nexo-verde);
  --bs-primary-rgb: 0, 135, 93;
  --bs-body-color: var(--nexo-texto);
  --bs-secondary-color: var(--nexo-texto-2);
  --bs-border-color: var(--nexo-borde);
  --bs-link-color: var(--nexo-verde);
  --bs-link-color-rgb: 0, 135, 93;
  --bs-link-hover-color: var(--nexo-verde-oscuro);
  --bs-link-hover-color-rgb: 0, 102, 70;
  --bs-body-font-family: "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;
  --bs-border-radius: 10px;
}

/* Misma jerarquía tipográfica que futurizalo.pe: títulos en Plus Jakarta Sans, texto y botones en Nunito. */
h1, h2, h3, h4, h5, .card-header, th, .nexo-total-valor, .nexo-producto, .nexo-nav .nav-link {
  font-family: "Plus Jakarta Sans", "Nunito", system-ui, sans-serif;
}
h1, h2, h3, h4, .h1, .h2, .h3, .h4 { font-weight: 800; letter-spacing: -0.02em; word-spacing: 0.08em; }
/* El gris va solo en el fondo de página: tarjetas, campos y tablas quedan en blanco (--bs-body-bg). */
body { background-color: var(--nexo-fondo); -webkit-font-smoothing: antialiased; }
.text-secondary { color: var(--nexo-texto-2) !important; }
:focus-visible { outline: 2px solid var(--nexo-verde); outline-offset: 2px; }

/* Navegación: misma cabecera translúcida que el sitio principal */
.nexo-nav {
  position: sticky; top: 0; z-index: 1020; padding-block: 0.7rem;
  background: rgba(240, 242, 245, 0.92); backdrop-filter: blur(16px) saturate(1.2); -webkit-backdrop-filter: blur(16px) saturate(1.2);
  border-bottom: 1px solid var(--nexo-borde);
}
.nexo-logo { display: inline-flex; align-items: center; gap: 0.7rem; margin-right: 1.5rem; padding-block: 0; }
.nexo-logo img { display: block; width: auto; }
.nexo-producto {
  font-weight: 800; font-size: 1.15rem; letter-spacing: -0.03em; line-height: 1; color: var(--nexo-verde);
  padding-left: 0.7rem; border-left: 1.5px solid var(--nexo-borde-2);
}
.nexo-ingreso-marca .nexo-producto { font-size: 1.5rem; }
.nexo-nav .nav-link { color: var(--nexo-texto-2); font-size: 0.9rem; font-weight: 600; letter-spacing: -0.01em; border-radius: 50px; padding-inline: 0.9rem !important; }
.nexo-nav .nav-link:hover { color: var(--nexo-texto); }
.nexo-nav .nav-link.active { color: var(--nexo-verde-oscuro); background: var(--nexo-verde-claro); }

/* Botones: píldora, Nunito 700, como en el sitio principal */
.btn {
  font-family: "Nunito", system-ui, sans-serif; font-weight: 700; border-radius: 50px; padding-inline: 1.25rem;
  transition: background-color .2s, border-color .2s, color .2s, box-shadow .2s, transform .2s;
}
.btn-sm { padding-inline: 0.85rem; }
.btn-primary { box-shadow: 0 2px 8px rgba(0, 135, 93, 0.2); }
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(0, 135, 93, 0.25); }
.btn-primary {
  --bs-btn-bg: var(--nexo-verde); --bs-btn-border-color: var(--nexo-verde);
  --bs-btn-hover-bg: var(--nexo-verde-oscuro); --bs-btn-hover-border-color: var(--nexo-verde-oscuro);
  --bs-btn-active-bg: var(--nexo-verde-oscuro); --bs-btn-active-border-color: var(--nexo-verde-oscuro);
  --bs-btn-disabled-bg: var(--nexo-verde); --bs-btn-disabled-border-color: var(--nexo-verde);
  --bs-btn-focus-shadow-rgb: 0, 135, 93;
}
.btn-outline-secondary {
  --bs-btn-color: var(--nexo-texto); --bs-btn-border-color: var(--nexo-borde-2); --bs-btn-bg: #fff;
  --bs-btn-hover-bg: var(--nexo-verde-claro); --bs-btn-hover-border-color: rgba(0, 135, 93, 0.35); --bs-btn-hover-color: var(--nexo-texto);
  --bs-btn-active-bg: var(--nexo-verde-claro); --bs-btn-active-border-color: rgba(0, 135, 93, 0.35); --bs-btn-active-color: var(--nexo-texto);
  --bs-btn-border-width: 1.5px;
}
.btn-light { --bs-btn-bg: var(--nexo-fondo); --bs-btn-border-color: var(--nexo-fondo); --bs-btn-hover-bg: var(--nexo-superficie); --bs-btn-hover-border-color: var(--nexo-superficie); }
.input-group > .btn { border-radius: 0 10px 10px 0; }

/* Formularios */
.form-label { font-weight: 600; font-size: 0.9rem; margin-bottom: 0.3rem; }
.form-control:focus, .form-select:focus, .form-check-input:focus {
  border-color: var(--nexo-verde); box-shadow: 0 0 0 0.2rem rgba(0, 135, 93, 0.18);
}
.form-check-input:checked { background-color: var(--nexo-verde); border-color: var(--nexo-verde); }
a:focus-visible, .btn:focus-visible { outline: 2px solid var(--nexo-verde); outline-offset: 2px; }
.nexo-calendario { flex: 0 0 2.9rem !important; width: 2.9rem !important; padding-inline: 0.55rem; color: transparent; }

/* Tarjetas y tablas */
.nexo-card { border: 1px solid var(--nexo-borde); border-radius: var(--nexo-radio); box-shadow: 0 1px 2px rgba(47, 53, 64, 0.05); overflow: hidden; }
.nexo-card > .card-header { background: #fff; font-weight: 700; border-bottom: 1px solid var(--nexo-borde); }
.nexo-card > .card-footer { background: #fafbfc; border-top: 1px solid var(--nexo-borde); }
.nexo-tabla thead th { background: var(--nexo-superficie); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.03em; color: var(--nexo-texto-2); white-space: nowrap; border-bottom: 0; }
.nexo-tabla thead th a { color: inherit; text-decoration: none; }
.nexo-tabla thead th a:hover { color: var(--nexo-verde-oscuro); }
.nexo-tabla td { border-color: #eef0f3; }
.nexo-importe { font-variant-numeric: tabular-nums; font-weight: 600; }
.nexo-enlace-fila { color: var(--nexo-texto); font-weight: 600; text-decoration: none; }
.nexo-enlace-fila:hover { color: var(--nexo-verde-oscuro); text-decoration: underline; }
.nexo-badge-prueba { background: #fff4d6; color: #7a5200; border: 1px solid #f0d58a; font-weight: 700; }
.page-link { color: var(--nexo-verde); }

.nexo-total-etiqueta { font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--nexo-texto-2); }
.nexo-total-valor { font-size: 1.6rem; font-weight: 800; line-height: 1.2; font-variant-numeric: tabular-nums; }
.nexo-ficha dt { font-weight: 600; color: var(--nexo-texto-2); }
.nexo-ficha dd { margin-bottom: 0.45rem; overflow-wrap: anywhere; }

/* Anchos de página */
.nexo-estrecho { max-width: 860px; margin-inline: auto; }
.nexo-angosto { max-width: 560px; margin-inline: auto; }
.nexo-ingreso { max-width: 420px; margin: 8vh auto 0; }
.nexo-ingreso-marca { margin-right: 0; margin-bottom: 0.75rem; }

/* Vista previa de adjuntos */
.nexo-adjunto-activo { background: rgba(0, 135, 93, 0.07); box-shadow: inset 3px 0 0 var(--nexo-verde); }
.nexo-vista-cuerpo { background: var(--nexo-superficie); display: flex; align-items: center; justify-content: center; min-height: 320px; padding: 1rem; }
.nexo-vista-cuerpo iframe { width: 100%; height: 70vh; border: 0; background: #fff; border-radius: 6px; }
.nexo-vista-cuerpo img { max-width: 100%; max-height: 70vh; object-fit: contain; border-radius: 6px; }
@media (min-width: 992px) {
  .nexo-vista { position: sticky; top: 5rem; }
  .nexo-vista-cuerpo { height: calc(100vh - 215px); min-height: 420px; }
  .nexo-vista-cuerpo iframe { height: 100%; }
  .nexo-vista-cuerpo img { max-height: 100%; }
}

/* En móvil, el nombre del archivo o elemento ocupa su propia línea y las acciones van debajo. */
@media (max-width: 575.98px) {
  .nexo-card .list-group-item { flex-wrap: wrap; }
  .nexo-card .list-group-item > .me-auto { flex: 0 0 100%; }
}

@media print {
  body { background: #fff; }
  .nexo-card { box-shadow: none; }
  .nexo-enlace-fila { text-decoration: none; }
}