/* Calculadora de plazos de negociación colectiva - sindicalsur.cl
   Estilos mínimos con prefijo nc-. Paleta: azul marino #1f4a63, amarillo #2f86b0,
   gris #5d7180, fondo #f5f7f6. */
.nc-calc {
  --nc-azul: #1f4a63;
  --nc-amarillo: #2f86b0;
  --nc-gris: #5d7180;
  --nc-fondo: #f5f7f6;
  --nc-linea: #d9dce2;
  --nc-blanco: #ffffff;
  --nc-rojo: #a3261b;
  color: var(--nc-azul);
  background: var(--nc-fondo);
  border-radius: 10px;
  padding: 20px 16px;
  max-width: 980px;
  margin: 0 auto;
  line-height: 1.5;
  box-sizing: border-box;
}
.nc-calc *, .nc-calc *::before, .nc-calc *::after { box-sizing: inherit; }
.nc-calc [hidden] { display: none !important; }

.nc-aviso {
  background: #eaf4f8;
  border: 2px solid var(--nc-amarillo);
  border-left-width: 8px;
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 20px;
}
.nc-aviso p { margin: 0; }
.nc-aviso-titulo { font-weight: 700; margin-bottom: 4px !important; }

.nc-form { display: grid; gap: 16px; }
.nc-grupo {
  border: 1px solid var(--nc-linea);
  border-radius: 8px;
  background: var(--nc-blanco);
  padding: 12px 16px 4px;
  margin: 0;
}
.nc-leyenda { font-weight: 700; padding: 0 6px; }
.nc-campo { margin-bottom: 14px; }
.nc-etiqueta { display: block; font-weight: 600; margin-bottom: 6px; }
.nc-ayuda { color: var(--nc-gris); font-size: 0.875em; font-weight: 400; margin: 4px 0 0; }
.nc-input {
  width: 100%;
  max-width: 220px;
  font: inherit;
  color: var(--nc-azul);
  padding: 9px 11px;
  border: 1px solid #b8bfca;
  border-radius: 6px;
  background: var(--nc-blanco);
  min-height: 44px;
}
.nc-input:focus { outline: 3px solid var(--nc-amarillo); outline-offset: 1px; border-color: var(--nc-azul); }
.nc-input[aria-invalid="true"] { border-color: var(--nc-rojo); }
.nc-input-num { max-width: 110px; }
.nc-opciones { display: flex; gap: 18px; flex-wrap: wrap; }
.nc-opcion { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; min-height: 32px; }
.nc-opcion input { accent-color: var(--nc-azul); width: 18px; height: 18px; }

.nc-avanzado {
  border: 1px solid var(--nc-linea);
  border-radius: 8px;
  background: var(--nc-blanco);
  padding: 10px 16px;
}
.nc-avanzado[open] { padding-bottom: 2px; }
.nc-avanzado-resumen { cursor: pointer; font-weight: 600; padding: 4px 0; }
.nc-avanzado[open] .nc-avanzado-resumen { margin-bottom: 10px; }

.nc-acciones { display: flex; gap: 10px; flex-wrap: wrap; }
.nc-boton {
  font: inherit;
  font-weight: 700;
  border: 2px solid var(--nc-azul);
  background: var(--nc-azul);
  color: var(--nc-blanco);
  padding: 10px 20px;
  border-radius: 6px;
  cursor: pointer;
  min-height: 44px;
}
.nc-boton:hover { background: #2b6283; }
.nc-boton:focus-visible { outline: 3px solid var(--nc-amarillo); outline-offset: 2px; }
.nc-boton-sec { background: transparent; color: var(--nc-azul); }
.nc-boton-sec:hover { background: #e9f0f1; }
.nc-error {
  color: var(--nc-rojo);
  background: #fbeceb;
  border: 1px solid #e3b4b0;
  border-radius: 6px;
  padding: 8px 12px;
}
.nc-error ul { margin: 0; padding-left: 18px; }

.nc-resultados { margin-top: 24px; }
.nc-resumen {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}
.nc-resumen-item {
  background: var(--nc-azul);
  color: var(--nc-blanco);
  border-radius: 8px;
  padding: 10px 14px;
}
.nc-resumen-etiqueta { display: block; font-size: 0.8em; color: #c9d2df; }
.nc-resumen-dato { display: block; font-weight: 700; }

.nc-alertas { margin-bottom: 16px; }
.nc-alerta {
  background: var(--nc-blanco);
  border-left: 5px solid var(--nc-gris);
  border-radius: 4px;
  padding: 8px 12px;
  margin: 0 0 8px;
}
.nc-alerta-grave { border-left-color: var(--nc-rojo); background: #fbeceb; }

.nc-subtitulo { font-size: 1.15em; margin: 24px 0 10px; }

.nc-timeline { list-style: none; margin: 0; padding: 0 0 0 4px; position: relative; }
.nc-timeline::before {
  content: "";
  position: absolute;
  left: 112px;
  top: 6px;
  bottom: 6px;
  width: 2px;
  background: var(--nc-linea);
}
.nc-hito { display: grid; grid-template-columns: 100px 1fr; gap: 24px; padding: 0 0 18px; position: relative; }
.nc-hito::before {
  content: "";
  position: absolute;
  left: 102px;
  top: 6px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--nc-blanco);
  border: 3px solid var(--nc-gris);
}
.nc-hito-fecha { font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
.nc-hito-dia { display: block; font-weight: 400; font-size: 0.8em; color: var(--nc-gris); }
.nc-hito-cuerpo {
  background: var(--nc-blanco);
  border: 1px solid var(--nc-linea);
  border-radius: 8px;
  padding: 10px 14px;
}
.nc-hito-cuerpo p { margin: 0 0 6px; }
.nc-hito-titulo { font-weight: 700; }
.nc-hito-detalle { color: #2c3a50; font-size: 0.95em; }
.nc-hito-ajuste {
  font-size: 0.9em;
  background: #eaf4f8;
  border-radius: 4px;
  padding: 4px 8px;
}
.nc-hito-cita summary { cursor: pointer; color: var(--nc-gris); font-size: 0.9em; }
.nc-hito-cita blockquote {
  margin: 6px 0 0;
  padding: 6px 10px;
  border-left: 3px solid var(--nc-amarillo);
  color: #2c3a50;
  font-size: 0.9em;
  background: var(--nc-fondo);
}
.nc-hito-critico .nc-hito-cuerpo { border-color: var(--nc-amarillo); border-width: 2px; }
.nc-hito-critico::before { background: var(--nc-amarillo); }
.nc-hito-pasado { opacity: 0.72; }

.nc-tipo-ventana::before { border-color: var(--nc-azul); }
.nc-tipo-fuero::before { border-color: #2f7d8c; }
.nc-tipo-respuesta::before { border-color: var(--nc-gris); }
.nc-tipo-reclamo::before { border-color: #6a5a9e; }
.nc-tipo-huelga::before { border-color: var(--nc-rojo); }
.nc-tipo-consecuencia::before { border-color: #000; border-radius: 2px; }

.nc-badge {
  display: inline-block;
  font-size: 0.78em;
  border-radius: 999px;
  padding: 1px 9px;
  border: 1px solid var(--nc-linea);
  color: var(--nc-gris);
  background: var(--nc-fondo);
  margin: 2px 0;
}
.nc-badge-art { background: var(--nc-azul); color: var(--nc-blanco); border-color: var(--nc-azul); }
.nc-badge-confirmado { background: #e3f1e6; color: #1d5a2c; border-color: #b6d9be; }
.nc-badge-proyectado { background: transparent; color: var(--nc-gris); border-style: dashed; border-color: var(--nc-gris); }

.nc-tabla-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--nc-linea); border-radius: 8px; background: var(--nc-blanco); }
.nc-tabla { width: 100%; border-collapse: collapse; font-size: 0.93em; }
.nc-tabla th, .nc-tabla td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--nc-linea); vertical-align: top; }
.nc-tabla th { background: var(--nc-azul); color: var(--nc-blanco); font-weight: 600; }
.nc-tabla td:first-child { white-space: nowrap; font-variant-numeric: tabular-nums; }
.nc-tabla td:nth-child(3) { white-space: nowrap; }
.nc-tabla tr.nc-hito-critico td:first-child { box-shadow: inset 4px 0 0 var(--nc-amarillo); }
.nc-tabla tr.nc-hito-pasado td { color: var(--nc-gris); }

.nc-notas { padding-left: 20px; margin: 0; }
.nc-nota { margin-bottom: 8px; }
.nc-feriados, .nc-pie { color: var(--nc-gris); font-size: 0.85em; margin-top: 16px; }

@media (max-width: 600px) {
  .nc-calc { padding: 16px 12px; border-radius: 0; }
  .nc-input { max-width: none; }
  .nc-timeline::before { left: 7px; }
  .nc-hito { grid-template-columns: 1fr; gap: 4px; padding-left: 26px; }
  .nc-hito::before { left: 0; }
  .nc-hito-fecha { text-align: left; }
  .nc-hito-dia { display: inline; margin-right: 6px; }
  .nc-tabla { min-width: 560px; }
}
